JavaScript-数据表清除输入过滤器

我正在使用数据表v1.10.11和Jquery v 2.2.0

我有一张桌子,上面有两个输入搜索过滤器;

<input type="text" id="myInputTextField1" class="form-control"> <!--search one-->

<input type="text" id="myInputTextField2" class="form-control"> <!--search two-->

我的数据表JS;

$(document).ready(function() {
    $('#example').dataTable({});
}); 

$('#myInputTextField1').keyup(function(){
  table.search($(this).val()).draw() ;
})

$('#myInputTextField2').keyup(function(){
  table.search($(this).val()).draw() ;
})

搜索工作正常,没有问题.

我如何合并一个简单的按钮,单击该按钮将清除两个输入字段并将表重置为默认状态?例如;

<button type="button" id="test">Clear Filters</button>

<table id="example">
<thead>
  <tr>
    <th>COLUMN 1</th>
    <th>COLUMN 2</th>
    <th>COLUMN 3</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>ROW 1</td>
    <td>ROW 1</td>
    <td>ROW 1</td>
  </tr>
  <tr>
    <td>ROW 2</td>
    <td>ROW 2</td>
    <td>ROW 2</td>
  </tr>
  <tr>
    <td>ROW 3</td>
    <td>ROW 3</td>
    <td>ROW 3</td>
  </tr>  
</tbody>
</table>

任何帮助表示赞赏.

解决方法:

要重置搜索过滤器,只需使用空字符串再次调用search()即可.同样,您可以通过将输入值设置为空字符串来清除输入值.尝试这个:

$('#test').click(function() {
    $('#myInputTextField1, #myInputTextField2').val('');
    table.search('').draw(); //required after
});

Working example

上一篇:C# DataTable


下一篇:Javascript-DataTables删除/隐藏列中包含重复信息的行