搜索文本框清除使用jquery ajax显示到html表中的所有数据

时间:2017-12-15 12:12:39

标签: php jquery ajax

当我第一次加载显示所有数据到HTML表格的页面时,我有HTML表格 使用PHP.I已经实现了ajax和jquery用于搜索它工作正常。当匹配时显示匹配的数据其他没有给出来自ajax url文件的结果消息。但是当我清空文本框时它没有显示所有的行。如何显示如果文本框为空所有记录。我是jquery和ajax的新手。请提供任何帮助。谢谢提前。

HTML

<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
              echo  $vndr_list;
              ?>
                      </tbody>
            </table>
    </div>



  <script type="text/javascript">
  $(function(){
     var minlength = 1;
    $("#search").keyup(function(){
    var value=$(this).val();
      if(minlength<value.length){
       //this is the table when loading first time showing all the data.
        $("#myTable").empty();
        $.ajax({
        url: "search.php",
        type: "POST",
        data: {name :value},
        success: function(html){
        $("#myTable").prepend(html);
      }
      });
    }
    });
    });

2 个答案:

答案 0 :(得分:0)

根据你的代码我会删除if(minlength

答案 1 :(得分:0)

<script type="text/javascript">
$(function(){
 var minlength = 0;
  $("#search").keyup(function(){
  var value=$(this).val();

   //this is the table when loading first time showing all the data.

    $.ajax({
    url: "search.php",
    type: "POST",
    data: {name :value},
    success: function(html){
  $("#myTable tbody").empty();
    $("#myTable > tbody").html(html);
  }
  });
});
});