Как обновить таблицу данных после очистки фильтра, нажав кнопку «Очистить»

Question

Я изменил вход фильтра dataTables в фильтр поиска Jquery Mobile , который также содержит кнопку удаления, чтобы очистить поле ввода.

Это работает только наполовину, потому что, когда я нажимаю "Удалить", поле ввода очищается, НО таблицы не обновляются.

Поэтому я ищу несколько советов о том, как обновить таблицупри нажатии на мою пользовательскую кнопку удаления внутри функции _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, которая вызовет функцию fnFilter , потому что теперь jqFilter.value не соответствует предыдущему поисковому запросу. Поскольку jqFilter пуст, fnFilter снова покажет всю таблицу.

Может быть, пригодится и кому-то еще.

Answer 2

Вы можете программно очистить фильтр, попросив API DataTables выполнить поиск пустой строки:

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

или, если у вас уже есть ссылка на объект:

oMyTable.fnFilter('');