更新dataTable搜索

updating dataTable search

本文关键字:搜索 dataTable 更新      更新时间:2023-09-26

我在我的网站上使用dataTables插件,我的搜索栏有一些小问题,这是包含在说的插件;我使用该代码来清除搜索栏,清空输入字段:

    function tog(v){return v?'addClass':'removeClass';} 
$(document).on('input', '.clearable', function(){
    $(this)[tog(this.value)]('x');
}).on('mousemove', '.x', function( e ){
    $(this)[tog(this.offsetWidth-18 < e.clientX-this.getBoundingClientRect().left)]('onX');
}).on('touchstart click', '.onX', function( ev ){
    ev.preventDefault();
    $(this).removeClass('x onX').val('').change().submit();
 });

取自这个stackoverflow问题

现在问题来了:每当我单击为清除输入而指定的叉号时,输入就会像它应该的那样被清除,然而,dataTable表仍然只显示与搜索输入相对应的表行。我如何清除dataTable搜索时,单击交叉。我注意到它只需要按下一个键,比如退格键、向下箭头键……更新搜索

你有两个选择

  1. 通过触发keyup事件通知dataTable搜索字段已更改

    // on 'touchstart click' event
    $(this).keyup();
    
  2. reDraw表手动

    var table = $('#example').DataTable();
    table.search('').draw();