Jquery，php - 自动完成 - 在查询中为搜索 var 传递附加 var答案

【问题标题】：Jquery ,php - autocomplete- pass additional var for search var in a queryJquery，php - 自动完成 - 在查询中为搜索 var 传递附加 var
【发布时间】：2019-01-04 08:48:56
【问题描述】：

这是我的第一页，我需要先按国家/地区过滤我的自动完成功能。截至目前，我的过滤器仅按公司名称。

[索引页]

    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/base/minified/jquery-ui.min.css" type="text/css" /> 

<?php 
//query get countries
$sql_getCountries = $db->query('SELECT * FROM tb_country ORDER BY id ASC');


          <select name="f_country_id" class="form-control" id="f_country_id">
            <option value="?cid=0&code=0" >-- Select Country --</option>
            <?php
                while($country = $sql_getCountries->fetch_assoc()){
                    echo '<option ';
                    if($country['id'] == $_GET['cid']){
                        echo ' selected ';
                    }
                    echo 'value="?cid='.$country['id'].'&code='.$country['d_code_country_letter'].'">'.$country['d_name'].'</option>';
                }           
            ?>
          </select>

?>
<script>
    $(function(){
      // bind change event to select
      $('#f_country_id').on('change', function () {
          var url = $(this).val(); // get selected value
          if (url) { // require a URL
              window.location = url; // redirect
          }
          return false;
      });
    });
</script>

      <hr>

<input type='text' name='d_name' value='' class='auto form-control' id="d_name"  placeholder="Name of Company/Establishment" >


    <!--- start here Autoload ////////// --->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.min.js"></script>    
    <script type="text/javascript">
    $(function() {

        //autocomplete
        $(".auto").autocomplete({
            source: "auto_search.php" ,
            //minLength: 1
        });             

    });
    </script>
    <!--- End here Autoload Scripts ////////// --->

============================= auto_search page : 该页面进行过滤的页面。

<?php 
    $stmt = $conn->prepare("SELECT a.* FROM tb_company_establishment a  WHERE a.d_name LIKE :term");
        $stmt->execute(array('term' => '%'.$_GET['term'].'%'));

        while($row = $stmt->fetch()) {
            $return_arr[] =  $row['d_name'];
        }

    } catch(PDOException $e) {
        echo 'ERROR: ' . $e->getMessage();
    }


    /* Toss back results as json encoded array. */
    echo json_encode($return_arr);

?>

请帮助我在 javascript 上传递 var，以便我可以在查询中使用它。

非常感谢。

【问题讨论】：

在他们的网站上有一个关于自动完成插件的相当广泛的文档：jqueryui.com/autocomplete/#multiple-remote
可以使用AJAX

标签： javascript php jquery autocomplete

【解决方案1】：

在您的索引页面中，将选项值替换为国家/地区id

// PHP
while($country = $sql_getCountries->fetch_assoc()){

    echo '<option value="'.$country['id'].'" ($country['id'] == $_GET['cid'] ? 'selected' : '')>'.$country['d_name'].'</option>';
}   

// Javascript
$('#f_country_id').on('change', function () {

  if ( this.value ) {

    $.get('{auto_search_url}', {countryId: this.value}, function(data) {
        console.log(data); // Display the data or reload the web page depends on how you want it
    });

  }

  return false;

});

【讨论】：