javascript - 如何在通过单击 "clear"按钮清除过滤器后刷新数据表

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');
      });

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

通过清除输入，我触发了输入上的按键。这将触发正常的 dataTables 例程，这将触发 fnFilter 函数，因为现在 jqFilter.value 与先前的搜索词不匹配。因为 jqFilter 为空 fnFilter 将再次显示整个表。

也许对其他人也有用。