filter parameter save and load on refresh/back button use case

kvvchetty

can you please give an example code in 1.10.19 to see, saveState = true, saveparameters and loadparameter on back-button click.

I have this option set in my datatable. From the list, I have a filter for few columns, I enter some value to pick few entries. I select a row to view details in another screen, When click the 'backbutton', I get the same resultset on the list-table view. The 'filter parameterts' are all blank. Don't know, how to put the entered filter criteria in the filter columns. Any comments would be helpful.
thank you

---

            "stateSave": true,
            "bStateSave": true,
            "fnStateSave": function (oSettings, oData) {
                localStorage.setItem( 'DataTables', JSON.stringify(oData) );
                },
            "fnStateLoad": function (oSettings) {
                return JSON.parse( localStorage.getItem('DataTables') );
                },
            'fnStateSaveParams': function(settings, data) {
                data.selected = this.api().rows({selected:true})[0];
            },
            'fnStateLoadParams': function(settings, data) {
              savedSelected = data.selected;

},

colin

Hi @kvvchetty ,

The stateSave will store the value of each column's filter and will reapply that filter on the next load, but it won't set the value in the filter control as that's outside the scope of the elements controlled by DataTables. You will need to reapply the stored search and insert it back into those controls in the stateLoadParams function (or initComplete),

Cheers,

Colin

kvvchetty

I found one similar question and response on 'stack overflow'

https://stackoverflow.com/questions/37030451/jquery-datatable-retain-filter-parameter-after-refresh

 var state = $dataTable.state.loaded();
 if ( state ) {
   $dataTable.columns().eq( 0 ).each( function ( colIdx ) {
   var colSearch = state.columns[colIdx].search;

   if ( colSearch.search ) {
     $('input', $('.filters th')[colIdx]).val( colSearch.search );
   }
  });
  $dataTable.draw();
 }

In this code snippet, If I enter filter condition for one column, get the resultset, go to another screen and comeback, all my filters filled with the one-value.

I have five filters with text-input and two of them has 'select drop-down' . Don't know, how to pass the index to the particular filter. Any comments would be helpful.

thank you

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

colin

Yep, that code will do - well, at least for a single input element. You just need to loop through your saved state data, and update all your input elements. If that doesn't help, we're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin