如何通过单击“清除”按钮清除筛选器后刷新数据表表格

我已将dataTables筛选器输入修改为Jquery Mobile search filter（其中还包括删除按钮）以清除输入字段。如何通过单击“清除”按钮清除筛选器后刷新数据表表格

这只适用于中途，因为当我点击删除，输入字段清除，但表不更新。

所以我在寻找一些关于如何刷新表格的提示，当点击我的自定义删除按钮里面的_fnFeatureHtmlFilter函数？

下面的代码显示了我如何设置JQM搜索。不要认为这有助于回答这个问题，虽然...

/* jqm search input */ 
    sSearchStr = oSettings.oInit.bJQueryMobileUI == true ? '<input placeholder="Filtern" data-type="search" data-theme="'+DataTable.ext.oJQMthemes.wrapperTheme+'" />' : 
     ((sSearchStr.indexOf('_INPUT_') !== -1) ? 
      sSearchStr.replace('_INPUT_', '<input type="text" />') : 
       sSearchStr==="" ? '<input type="text" />' : sSearchStr+' <input type="text" />'); 
    var nFilter = document.createElement('div'); 
    /* jqm wrapper classes */ 
    nFilter.className = oSettings.oInit.bJQueryMobileUI == true ? "ui-block-c "+oSettings.oClasses.sFilter : oSettings.oClasses.sFilter; 
    oSettings.oInit.bJQueryMobileUI == true ? $(nFilter).html(sSearchStr) : $(nFilter).html('<label>'+sSearchStr+'</label>');

感谢您的一些提示！

来源

2012-02-23 frequent

实测值的溶液：

$('.dataTables_filter .ui-input-clear').live('click', function(e) {  
     jqFilter.val(""); 
     jqFilter.trigger('keyup.DT'); 
     });

此结合到清除按钮。所以当它被点击时，我将手动设置输入值为“”，因为JQM清除按钮似乎并没有真正清除输入本身。

用我清除的输入，我触发输入上的键。这将触发正常的dataTables rountine，它将触发fnFilter函数，因为现在jqFilter.value与前一个搜索项不匹配。由于jqFilter为空fnFilter将再次显示整个表格。

也许对其他人有用。

来源

2012-02-23 17:31:58 frequent

因此，该死的有用。我无法相信，但是。感谢你！数据表插件没有一种通过JS控制搜索/过滤器的优美方式，这太糟糕了。 – 2012-02-28 01:22:35

可以编程通过询问数据表API搜索空字符串清除过滤器：

$('#myTable').dataTable().fnFilter('');

，或者如果你已经有了一个对象引用：

oMyTable.fnFilter('');

来源

2014-08-25 10:39:56

感谢所有贡献者，但我实际上发现这个答案更加简洁和重点。 – mtchuente 2015-11-09 14:56:25

如何通过单击“清除”按钮清除筛选器后刷新数据表表格

回答

相关问题