How to clear the custom filters,sorts but keep the pagination of previous state

rakibulhaq

I have managed to get a datatable to have some custom filters in the columns using help from this forum. And I use stateSave: true so that the datatable has the previous page active when revisited from another page.
Here is the initComplete() to show how i am clearing the custom filters.

initComplete: function() {
        this.api().columns([4, 5, 6]).every(function() {
            var column = this;
            //fix for filter caching in the datatable when page revisited
            column.search('').draw();
            var select = $('<select><option value="">All</option></select>')
                .appendTo($('thead tr:eq(1) td').eq(this.index()))
                .click(function(e) {
                    e.stopPropagation();
                })
                .on('change', function() {
                    var val = $.fn.dataTable.util.escapeRegex(
                        $(this).val()
                    );
                    column
                        .search(val ? '^' + val + '$' : '', true, false)
                        .draw();
                });

            column.data().unique().sort().each(function(data, index) {
                select.append('<option value="' + data + '">' + data + '</option>')
            });
        });
}

but the problem is, when i am clearing the search fields, i guess the datatable is redrawn so the previous state of pagination is lost, i need to clear the filters saved on previous state but keep the pagination. How should i go about it? Any suggestion is much appreciated.

N.B. the reason i want to clear the filters is, when user types something and does not clear the filter, then he goes to another page then comes back again to that datatable's page, the filters are not showing, but the datatable is blank with no data, saying it is showing filtered data.

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

rakibulhaq

here is the html snippet of the custom filters placement in the <thead> </thead> for the datatable if that helps:

<table class="table table-striped table-bordered dataex-html5-selectors">
        <thead>
             <tr>
                 <th>No</th>
                 <th>File Code</th>
                 <th>File Name</th>
                 <th>Rev#</th>
                 <th>Buidling Name</th>
                 <th>Area Name</th>
                 <th>Status</th>
              </tr>
              <tr>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td></td>
              </tr>
       </thead>
       <tbody>
             ....//datatable body
       </tbody>
       <tfoot>
            ...//datatable footer
       </tfoot>
</table>

colin

Hi @rakibulhaq ,

You can modify the state loaded with stateLoadParams, but I suspect that won't help. The pagination is determined by the filtering - if you remove the filtering then the pagination wouldn't be the same, so it wouldn't make sense to just keep the pagination.

Cheers,

Colin

rakibulhaq

Hi @colin ! Thanks for your response, yeah, i guess you are right, but is there anyway i can get the current page no each time the page changes in the datatable?
say, a user has moved onto page 3,

there will be a handler to capture that, in that way,
i would send the page no to php session setter script. and
when i am clearing the search field, i would also pass the page number retrieving from the session variable during the draw() like..

table.search('').page(pageNo).draw();

Sorry if i am making it complex, but this is the scenario more or less. Any suggestion?

colin

Hi @rakibulhaq ,

You can use page to get triggered whenever the page is changed, then you can grab the current page as shown in the example in that link.

Cheers,

Colin

rakibulhaq

Thank you very much @colin ! I think it would solve my problem, will explore and notify.