Question

我有一个包含数组字段的表单，其中每行表示一条记录。在获取item_name的自动完成数据后，我需要相应的company_name字段自动填充从数据库中提取数据。这是我的代码：

＆＃13;

$(document).ready(function() {
  $(".inputitem").autocomplete({
    source: 'search.php',
    minLength: 1,
    select: function(e, ui) {
      $('#result').html(e);
      $("#company_name", this).val(ui.item.company);
    }
  });
});

＆＃13;

This form is an array of item_name and company_name. I need to auto fill company_name textbox according to the item_name auto complete data
<form action="" method="post" name="stock">
  <table cellpadding="2" cellspacing="0" border="0" width="100%" class="FormTbl">
    <tbody>
      <tr>
        <td>
          <strong>Item Name</strong>
        </td>
        <td>
          <strong>Company</strong>
        </td>
      </tr>
      <tr>
        <td>
          <input class="inputitem" type="text" name="item_name[]" id="item_name" autocomplete="off">
        </td>
        <td>
          <input type="text" name="company_name[]" id="company_name" value="">
        </td>
      </tr>
      <tr>
        <td>
          <input class="inputitem" type="text" name="item_name[]" id="item_name" autocomplete="off">
        </td>
        <td>
          <input type="text" name="company_name[]" id="company_name" value="">
        </td>
      </tr>
      <tr>
        <td>
          <input class="inputitem" type="text" name="item_name[]" id="item_name" autocomplete="off">
        </td>
        <td>
          <input type="text" name="company_name[]" id="company_name" value="">
        </td>
      </tr>
      <tr>
        <td colspan="2">
          <input type="submit" name="btnSubmit" id="btnSubmit" value="Submit">
        </td>
      </tr>
    </tbody>
  </table>
</form>    
This page returns item_name and company_name as autocomplete value
<?php
/* 
search.php
*/
require_once("connection.php");
$q=$_GET["term"];
$result = $mysqli->query("SELECT id,item_name,company_name  FROM tbl_item WHERE item_name LIKE '$q%' ORDER BY id LIMIT 15");
$json=array();
while($rasItem=$result->fetch_array(MYSQLI_ASSOC)){
    $json[]=array(
    'value'=> $rasItem["item_name"],
    'label'=> $rasItem["item_name"],
    'company'=> $rasItem["company_name"]
    );
}
echo json_encode($json);
?>

＆＃13;

Answer 1

我在这里创建了DEMO。

在本次DEMO中，我假设您从search.php返回的JSON数据具有以下结构：

var itemsArrray = [
  {
    value: "Item 1",
    label: "Item 1",
    company: "Company 1",
    company_id: "cmp1"
  },
  {
    value: "Item 2",
    label: "Item 2",
    company: "Company 2",
    company_id: "cmp2"
  },
  {
    value: "Item 3",
    label: "Item 3",
    company: "Company 3",
    company_id: "cmp3"
  }
];

我在class文本框中添加了company_name company_name，当您选择项目时，该文本框将自动填充

$(".inputitem").autocomplete({
      //source: 'search.php',
      source: itemsArrray,
      minLength: 1,
      select: function(event, ui) {
        //Here $(this) points to the current autocomplete input element
        $(this).closest('tr').find('input.company_name').val(ui.item.company);
        $(this).closest('tr').find('input.company_id').val(ui.item.company_id);
      }
    });

基于自动完成的数据自动填充的另一个文本字段

1 个答案: