在单击预输入选项/行之前不显示表结果

时间:2019-08-23 23:03:57

标签: jquery typeahead.js

我使用typeahead来搜索表格,但是在我的JS中,表格是在搜索之前绘制的。 我希望桌子首先隐藏起来。 如何避免在选择并单击预先输入的下拉菜单中的选项之前显示表格? 我认为,一旦单击“ li”就可以启动查询,但是似乎并非如此。 这是我的Js:

$(document).ready(function(){

 load_data('');

 function load_data(query, typehead_search = 'yes')
 {
  $.ajax({
   url:"fetch.php",
   method:"POST",
   data:{query:query, typehead_search:typehead_search},
   success:function(data)
   {
    $('#employee_data').html(data);
   }
  });
 }

 $('#employee_search').typeahead({
  order: "asc",
  source: function(query, result){
   $.ajax({
    url:"fetch.php",
    method:"POST",
    data:{query:query},
    dataType:"json",
    success:function(data){
     result($.map(data, function(item){
      return item;
     }));
     load_data(query, 'yes');
    }
   });
  }
 });

 $(document).on('click', 'li', function(){
  var query = $(this).text();
  load_data(query);
 });

});

和我的Php获取预输入并绘制表格:

<?php
//fetch.php
if(isset($_POST["query"]))
{
 $connect = mysqli_connect("localhost", "", "", "");
 $request = mysqli_real_escape_string($connect, $_POST["query"]);
 $query = "
  SELECT * FROM User 
  WHERE USERID LIKE '%".$request."%' 
  OR PARTYID LIKE '%".$request."%' 
  OR Agent LIKE '%".$request."%' 

 ";
 $result = mysqli_query($connect, $query);
 $data =array();
 $html = '';
 $html .= '
  <table class="table table-bordered table-striped">
   <tr>
    <th>USERID</th>
    <th>PARTYID</th>
    <th>Agent</th>
   </tr>
  ';
 if(mysqli_num_rows($result) > 0)
 {
  while($row = mysqli_fetch_array($result))
  {
   $data[] = $row["USERID"];
   $data[] = $row["PARTYID"];
   $data[] = $row["Agent"];
   $html .= '
   <tr>
    <td>'.$row["USERID"].'</td>
    <td>'.$row["PARTYID"].'</td>
    <td>'.$row["Agent"].'</td>
   </tr>
   ';
  }
 }
 else
 {
  $data = 'No Data Found';
  $html .= '
   <tr>
    <td colspan="3">No Data Found</td>
   </tr>
   ';
 }
 $html .= '</table>';
 if(isset($_POST['typehead_search']))
 {
  echo $html;
 }
 else
 {
  $data = array_unique($data);
  echo json_encode($data);
 }
}

?>

0 个答案:

没有答案