javascript 单击“清除”按钮清除过滤器后如何刷新数据表
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9415655/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to refresh a datatables table after clearing the filter by clicking on a "clear" button
提问by frequent
I have modified the dataTablesfilter input into a Jquery Mobile search filter, which also inlcudes a delete button, to clear the input field.
我已将dataTables过滤器输入修改为Jquery Mobile 搜索过滤器，其中还包含一个删除按钮，以清除输入字段。
This only works half-way, because when I click delete, the input field clears BUT the tables does not update.
这只能进行一半，因为当我单击删除时，输入字段会清除但表不会更新。
So I'm looking for some hints on how to refresh the table when clicking on my custom delete button inside the _fnFeatureHtmlFilterfunction?
因此，当单击_fnFeatureHtmlFilter函数内的自定义删除按钮时，我正在寻找有关如何刷新表格的提示？
The below code shows how I set up the JQM search. Don't think it's helpful for answering the question though...
下面的代码显示了我如何设置 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>');
Thanks for some tips!
感谢您提供一些提示！
回答by frequent
Found a solution:
找到了解决办法：
$('.dataTables_filter .ui-input-clear').live('click', function(e) {
jqFilter.val("");
jqFilter.trigger('keyup.DT');
});
This binds to the clear button. So when it's clicked I'm setting the input value to "" manually, because the JQM clear button doesn't seem to really clear the input itself.
这绑定到清除按钮。所以当它被点击时，我手动将输入值设置为 ""，因为 JQM 清除按钮似乎并没有真正清除输入本身。
With my cleared input I trigger a keyup on the input. This will fire the normal dataTables rountine, which will fire the fnFilterfunction, because now jqFilter.value does not match the previous search term. Because jqFilter is empty fnFilterwill show the whole table again.
清除输入后，我会在输入上触发一个键。这将触发正常的 dataTables 例程，这将触发fnFilter函数，因为现在 jqFilter.value 与之前的搜索词不匹配。因为 jqFilter 为空fnFilter会再次显示整个表格。
Maybe useful for somebody else, too.
也许对其他人也有用。
回答by James McCormack
You can programatically clear the filter by asking the DataTables API to search for empty string:
您可以通过要求 DataTables API 搜索空字符串来以编程方式清除过滤器：
$('#myTable').dataTable().fnFilter('');
$('#myTable').dataTable().fnFilter('');
or if you already have an object reference:
或者如果您已经有一个对象引用：
oMyTable.fnFilter('');
oMyTable.fnFilter('');
