Question

我已将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>');

感谢您的一些提示！

Answer 1

找到解决方案：

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

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

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

对其他人也许有用。

Answer 2

您可以通过要求DataTables API搜索空字符串来以编程方式清除过滤器：

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

或者如果您已有对象引用：

oMyTable.fnFilter('');

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

2 个答案: