DataTables 1.10.3 - Individual Column Filter (Search) - Save State

DataTables 1.10.3 - Individual Column Filter (Search) - Save State

GeMaGeMa Posts: 7Questions: 2Answers: 0
edited August 2014 in Free community support

I'm using DataTables 1.10.3 to construct a server-side table (oTable) with

"stateSave": true
"stateDuration": -1.

Above the table I have a drop-down list, populated by an AJAX call with all possible values a specific table column (idx = 8) could have.

$('#Org').on( 'change', function () {
    oTable.column( 'org:name' ).search( $('#Org option:selected').val() ).draw();
});

The above code successfully filters the table, showing only the rows corresponding to the selected value of the filter drop-down box. And

oTable.state().columns[8].search.search

is now holding the filter value.

But when I navigate to another page and return to the DataTables page,

oTable.state().columns[8].search.search

is empty and therefore NOT holding the value I set in the filter.
It seems State Saving is only saving the global search and no individual column searches.

How can I get my column searches to be saved and how do I retrieve them once I return to the page?

I'm using the latest API.
Thanks in advance.
GeMa

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 63,516Questions: 1Answers: 10,472 Site admin
    Answer ✓

    Can you link to a test page showing the issue please? That does sound like it should work...

    Thanks,
    Allan

  • GeMaGeMa Posts: 7Questions: 2Answers: 0
    edited August 2014

    Apparently I was accessing the oTable.state().columns[8].search.search too early in the page building process.

    The correct way to do it is by the using oTable.state.loaded() as in:

    $(document).ready( function () {
        var state = oTable.state.loaded();
        if ( state ) {
            oTable.columns().eq( 0 ).each( function ( colIdx ) {
                var colSearch = state.columns[colIdx].search;
                
                if ( colSearch.search ) {
                    if ( colIdx == 7 ) {
                        $('select[name=Service]').val( colSearch.search );
                    }
                    if ( colIdx == 8 ) {
                        $('select[name=Titularis]').val( colSearch.search );
                    }
                    if ( colIdx == 5 ) {
                        $('select[name=Type]').val( colSearch.search );
                    }
                    if ( colIdx == 6 ) {
                        $('select[name=Org]').val( colSearch.search );
                    }
                    if ( colIdx == 11 ) {
                        $('select[name=Datum]').val( colSearch.search );
                    }
                    if ( colIdx == 10 ){
                        $('select[name=Status]').val( colSearch.search );
                    }
                    $('.selectpicker').selectpicker('refresh');
                }
            });
        };
    });
    

    This post put me in the right direction: http://datatables.net/forums/discussion/22554/state-saving-and-individual-column-filters#latest

    Especially this example: http://live.datatables.net/neqozaj/1/edit

    Thanks. Allan.

This discussion has been closed.