实时搜索获得多个字段

Question

我有这个实时搜索，并且效果很好。 我想做的是我想获得另一个领域。 除了获取感应器名称外，我还想通过使用实时搜索单击指标名称，将其分配给另一种输入类型来获取其ID。

脚本：

  <script type="text/javascript">
       $(document).ready(function() {
       $('#indicatorname').autocomplete({
           source: function( request, response ) {
           $.ajax({
             url : 'ajax.php',
             dataType: "json",
        data: {
           name_startsWith: request.term,
           type: 'indicatorname'
        },
         success: function( data ) {

           response( $.map( data, function( item ) {
            return {
              label: item,
              value: item
            }
          }));  


         }
          });
        },
        autoFocus: true,
        selectFirst: true,
        minLength: 0,
        focus : function( event, ui ) {
         $('#indicatorname').html(ui.item.value);
        },
        select: function( event, ui ) {
         $('#indicatorname').html(ui.item.value);
        },
        open: function() {
         $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top");
        },
        close: function() {
          $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
        }           
         });

     $('#slider').rhinoslider({
        effect: 'transfer'
      });
        });
   </script>

继承人ajax.php：

  <?php

   $connection = pg_connect("host=localhost dbname=brgy_profiler
                 user=postgres password=password");

    if (!$connection)
         {  
          echo "Couldn't make a connection!";
         }

  ?>

<?php

    if($_GET['type'] == 'indicatorname'){
     $result = pg_query("SELECT cindicatordesc,nindicatorid from
                          tbl_indicators where cindicatordesc LIKE
                          '%".$_GET['name_startsWith']."%'");   
     $data = array();
    while ($row = pg_fetch_array($result)) 
       {
         array_push($data, $row['cindicatordesc']);
       }    

        echo json_encode($data);
     }

  ?>

这是我的tbl_indicator：

如何使用ajax实时搜索获取nindicatorid字段并将其与cindicatordesc一起使用？

注意：仅显示cindicatordesc，nindicatorid将保存为输入类型。

Answer 1

没问题 您可以在“自动完成select返回”中添加其他数据属性，

 $('#indicatorname').autocomplete({   
         source: function( request, response ) {
         ...........
         success: function( data ) {
           response( $.map( data, function( itemList ) {
            return {
              label: itemList.label,
              value: itemList.value,
              extraField : itemList.extraField
                }
          }));

因此，您只需要在服务器端进行更改就可以将额外的值发送到自动完成AJAX。

并且，在select事件中，您可以获取ui.item.extraField的值。

这是使用多个属性的示例演示 。 尽管与您所做的不一样，但内部逻辑是相同的。