使用jquery ajax如何显示显示在表中的搜索数据

时间:2017-12-15 05:01:04

标签: php jquery html ajax

我已经创建了HTML表并使用PHP显示数据。现在我想使用jquery ajax在该表上实现搜索操作。我是jquery和ajax的新手。我想要的是如果我输入超过3个字符的话应该根据搜索显示记录。我尝试了一些不起作用的代码。我不知道我尝试的方式是否正确,请任何帮助将不胜感激。谢谢提前。

HTML:

  <input name="search" id="search" type="search">
  <div class="scrollingTable result" style="width:100%;">
  <table id="myTable" class="table table-striped table-bordered table-fixed" 
      cellspacing="0" style="width:100%;padding-top:20px;">
                   <thead>
                      <tr>
                        <th>Name</th>
                        <th>Address</th>
                        <th>Telephone</th>
                        <th>Email</th>
                        <th>GSTIN Number</th>
                        <th>Bankname</th>
                        <th>Account Number</th>
                        <th>IFSC Code</th>
                        <th>Edit</th>
                  </tr>
                </thead>
                      <tbody>
            <?php  if($vlist !=""){
               echo $vlist;
            }else {?>
                        <?php echo  $vndr_list;
          }?>
                      </tbody>
            </table>
    </div>

 this is my jquerycode

<script type="text/javascript">
  $(function(){
     var minlength = 3;
    $("#search").keyup(function(){
      debugger;
    var value=$(this).val();
      if(minlength<value.length){
        $.ajax({
        url: "search.php",
        type: "POST",
        data: {name :value},
        success: function(html){
        $("#myTable").append(html);
      }
      });
      }
    });
    });

 this is my php file search file which is calling in ajax

<?php
require('Assests/connection/connection.php');
$vlist = "";
 if(isset($_POST['name'])){
 $find=$_POST['name'];
 $result = mysqli_query($conn,"SELECT `vndr_id`, s.state as 
state,`vndr_name`, 
`vndr_address`, `vndr_pincode`, `vndr_telephone`, `vndr_mobile`, 
`vndr_mailid`, `vndr_country`, `vndr_gsttin`, `vndr_cstno`, 
`vndr_totaldebit`, 
`vndr_totalcredit`, `vndr_bankname`, `vndr_acno`, `vndr_ifsccode` FROM 
`vendors` vndr INNER JOIN states s ON vndr_state=s.state_id
WHERE vndr_name LIKE '%{$find}%' OR vndr_mailid LIKE '%{$find}%'") or 
DIE(mysqli_error($conn));

while ($row = mysqli_fetch_array($result))
{
        $id          = $row['vndr_id'];
        $vndrname    = $row['vndr_name'];
        $vndraddres  = $row['vndr_address'];
        $vndrpincode = $row['vndr_pincode'];
        $vndrstate   = $row['state'];
        $vndrtlphno  = $row['vndr_telephone'];
        $vndrmobile  = $row['vndr_mobile'];
        $vndrmailid  = $row['vndr_mailid'];
        $vndrcountry = $row['vndr_country'];
        $vndrgst     = $row['vndr_gsttin'];
        $vndrcst     = $row['vndr_cstno'];
        $vndrdebit   = $row['vndr_totaldebit'];
        $vndr_credit = $row['vndr_totalcredit'];
        $vndrbnkname = $row['vndr_bankname'];
        $vndracno    = $row['vndr_acno'];
        $vndrifsc    = $row['vndr_ifsccode'];

        $vlist.="
                                                    <tr>
                                                       <td>$vndrname </td>
                                                       <td>$vndraddres ,$vndrstate - $vndrpincode</td>
                                                       <td>$vndrtlphno , $vndrmobile</td>
                                                       <td> $vndrmailid </td>
                                                       <td> $vndrgst</td>
                                                       <td>$vndrbnkname</td>
                                                       <td>$vndracno </td>
                                                       <td>$vndrifsc</td>
                                                       <td><a href='abc.php?id=$id'><i class='fa fa-edit fa-2x'></i></a></td>
                                                    </tr>
    }                                                ";
   }
    echo   $vlist;
 ?>

1 个答案:

答案 0 :(得分:1)

根据您的要求,如果您使用某些客户端库(如数据表)会更好。请查看此链接https://datatables.net/examples/ajax/simple.html。在这种情况下,你应该有更好的知识处理json并使用php&amp; MySQL的。希望这可以帮助。感谢