从数据库中提取隐藏的product_id以填充jQuery自动完成插件列表。

huangapple
go评论104阅读模式
英文:

Fetch hidden product_id from database to jquery autocomplete plugin list

问题

我正在使用 jQuery 自动完成插件来使用 PHP、MySQL 和 Ajax 从数据库中选择数据。该插件运行良好，除了获取 product_id。当插件获取自动完成列表时，我还想附加一个隐藏的 product_id 到产品上，以区分产品，例如在同一 product_name 下有多个产品的情况。

下面是仅使用 product_name 功能的代码。

  1. function select_name(){
  3.  $("[id^='product_name']").focus(function() {
  4.   var id = $(this).attr('id');
  5.   id = id.replace("product_name",'');
  6.   $("[id^='product_name']").autocomplete({
  7.       
  8.       source: 'store_supply/fetch_autocomplete_name.php',
  9.       select: function (event, ui) {
  10.           var pro_nm = ui.item.value; 
  11.           $.ajax({
  12.                   url:"store_supply_manage/fetch_product_code.php",
  13.                   method:"POST",
  14.                   data:{pro_nm:pro_nm}, 
  15.  //在选择 product_name 时，我想要发布一个 product_id
  16.                   dataType:"json",
  17.                   success:function(data){
  19.                       $('#mu_emri_'+id).val(data.mu_name);
  20.                       $('#product_code_'+id).val(data.barCode);
  21.                       $('#vat_vlera_'+id).val(data.vat_value_4);
  22.                       $('#product_id'+id).val(data.product_id);
  24.                       calculateTotal();
  25.                   }
  26.           });
  27.       }  
  28.       
  29.    });
  30.  });
  31. }

//fetch_autocomplete.php

if (isset($_GET['term'])) {

$term = $_GET['term'];

$query = $db->prepare("SELECT product_name FROM products
WHERE product_name LIKE '%$term%' LIMIT 10");
$query->execute();

$nr = $query->rowCount();

if ($nr > 0) {
while ($row = $query->fetch()) {
$result[] = $row['product_name'];
}
}
else {
$result = array();
}
//返回 JSON 结果
echo json_encode($result);
}

  2. <details>
  3. <summary>英文:</summary>
  5. I am using jquery autocomplete plugin for selecting data from database using PHP, MySql and Ajax.
  6. The plugin operates good except fetching the product_id. When the plugin fetches the autocomplete list I want also to attach a hidden product_id to the products to differentiate the products for example in case of multiple products with the same product_name. 
  8. Below is the code that functions only with product_name.
  1. function select_name(){
  3.  $(&quot;[id^=&#39;product_name&#39;]&quot;).focus(function() {
  4.   var id = $(this).attr(&#39;id&#39;);
  5.   id = id.replace(&quot;product_name&quot;,&#39;&#39;);
  6.   $(&quot;[id^=&#39;product_name&#39;]&quot;).autocomplete({
  7.       
  8.       source: &#39;store_supply/fetch_autocomplete_name.php&#39;,
  9.       select: function (event, ui) {
  10.           var pro_nm = ui.item.value; 
  11.           $.ajax({
  12.                   url:&quot;store_supply_manage/fetch_product_code.php&quot;,
  13.                   method:&quot;POST&quot;,
  14.                   data:{pro_nm:pro_nm}, 
  15.  //here I want to post a product_id when selecting the     product_name
  16.                   dataType:&quot;json&quot;,
  17.                   success:function(data){
  19.                       $(&#39;#mu_emri_&#39;+id).val(data.mu_name);
  20.                       $(&#39;#product_code_&#39;+id).val(data.barCode);
  21.                       $(&#39;#vat_vlera_&#39;+id).val(data.vat_value_4);
  22.                       $(&#39;#product_id&#39;+id).val(data.product_id);
  24.                       calculateTotal();
  25.                   }
  26.           });
  27.       }  
  28.       
  29.    });
  30.  });
  31. }
  33.     //fetch_autocomplete.php
  35. if (isset($_GET[&#39;term&#39;])) {
  37.   $term = $_GET[&#39;term&#39;];
  39.   $query = $db-&gt;prepare(&quot;SELECT product_name FROM products 
  40.                          WHERE product_name LIKE &#39;%$term%&#39;   LIMIT 10&quot;);
  41.   $query-&gt;execute();
  43.    $nr = $query-&gt;rowCount();
  45.   if ($nr &gt; 0) {
  46.     while ($row = $query-&gt;fetch()) {
  47.     $result[] = $row[&#39;product_name&#39;];
  48.     }
  49.    }
  50.   else {
  51.     $result = array();
  52.   }
  53.   //return json result
  54.    echo json_encode($result);
  55.   }
  2. </details>
  5. # 答案1
  6. **得分**: 1
  8. 在你的代码中，你正在准备你的SQL语句，但是在查询时插入了变量`$term`，而没有对查询进行参数化。在下面的示例中，我已经对你的查询进行了参数化。
  10. 如[文档](https://api.jqueryui.com/autocomplete/#option-source)所示，数据可以是以下之一：
  12. > * 字符串数组：["Choice1", "Choice2"]
  13. > * 带有标签和值属性的对象数组：[{ label: "Choice1", value: "value1" }, ...]
  15. 因此，你可以将你的`fetch_autocomplete.php` 更改为以下内容：
  17. ```php
  18. if (isset($_GET['term'])) {
  20.     $term = '%' . $_GET['term'] . '%';
  22.     // 使用nowdoc语法的参数化查询
  23.     $sql = <<<SQL
  24.         SELECT id AS `value`, product_name AS `label`
  25.         FROM products
  26.         WHERE product_name LIKE :term
  27.         LIMIT 10
  28.         SQL;
  30.     // 准备查询
  31.     $query = $db->prepare($sql);
  33.     // 绑定变量并执行查询
  34.     $query->execute(['term' => $term]);
  36.     // 由于fetchAll()在没有匹配行的情况下返回空数组，因此无需检查返回的行
  37.     $result = $query->fetchAll(PDO::FETCH_OBJ);
  38.     
  39.     // 返回JSON结果
  40.     echo json_encode($result);
  41. }

将id更改为你的产品ID列的名称。现在，在你的select处理程序中，ui.item.value将是产品ID，而不是产品名称。

英文:

In your code you are preparing your SQL statement but interpolating the $term variable instead of parameterizing your query. In the example below I have parameterized your query.

As shown in the documentation, the data can be either:

> * An array of strings: [ "Choice1", "Choice2" ]
> * An array of objects with label and value properties: [ { label: "Choice1", value: "value1" }, ... ]

So you can just change your fetch_autocomplete.php to something like:

  1. if (isset($_GET[&#39;term&#39;])) {
  3.     $term = &#39;%&#39; . $_GET[&#39;term&#39;] . &#39;%&#39;;
  5.     // parameterized query in nowdoc*
  6.     $sql = &lt;&lt;&lt;&#39;SQL&#39;
  7.         SELECT id AS `value`, product_name AS `label`
  8.         FROM products
  9.         WHERE product_name LIKE :term
  10.         LIMIT 10
  11.         SQL;
  13.     // prepare the query
  14.     $query = $db-&gt;prepare($sql);
  16.     // bind variables and execute
  17.     $query-&gt;execute([&#39;term&#39;] =&gt; $term);
  19.     // As fetchAll() returns an empty array if there are no matching
  20.     // rows we do not need to check rows returned
  21.     $result = $query-&gt;fetchAll(PDO::FETCH_OBJ);
  22.     
  23.     // return json result
  24.     echo json_encode($result);
  25. }

* nowdoc

Change id to whatever the name of your product id column is. Now, inside your select handler, ui.item.value will be the product id instead of its name.

huangapple
  • 本文由 发表于 2023年2月18日 21:14:06
  • 转载请务必保留本文链接：https://go.coder-hub.com/75493575.html
  • ajax
  • jquery
  • mysql
  • php
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定