Custom filters and state saving

CharlyPoppins

Hi,

I have a custom filter <select> with works like this

$("#mytable").on('change', function() {
    $("#mytable").DataTable().column('s.id:name').search(val_societes);
    $("#mytable").DataTable().draw();
});

that works fine, then when I refresh my web page, the table is still filtered with this <select> values but the <select> options are not "selected".

I began with this

$("#mytable").DataTable().state().columns.forEach(function(element, index) {
    if( element.search.search !== "" ) {
        // here is my column id and its search values
    }
});

but I can't figure out how to "link" it with the <select>, any idea ?

allan

You would need to use the state.loaded() method to get the state that was loaded and set the selected value for the search input based on that.

Allan

CharlyPoppins

Yes, but I only got the index of the column and the search value, how can I get the name of the column ?

allan

The column name (columns.name) isn't something that is saved in the state object (documented here) - you would need to use the column index rather than the name.

Allan

CharlyPoppins

I get it, but can I get the column name with the API $("#mytable").DataTable();

Something like $("#mytable").DataTable().colums(myIndex).name(); ?

allan

Currently no. The searchable list of API methods is available here and there is no column().name() option at the moment.

However, I think using the column name as a selector would probably be more useful for you (otherwise you'd need to loop over all of the names returned to get the index). Select the column by name and then use column().index() to get its index.

Allan

CharlyPoppins

I'm lost, maybe there's something i don't understand, or maybe my explanations wasn't clear.
Seems the only way is to do this, am I right ?

dtTableAPI = $("#table").DataTable();
dtTableAPI.state().columns.forEach(function(element, index) {
    if( element.search.search !== "" ) {
        if( dtTableAPI.column('s.id:name').index() == index ) {
            // select options in my <select>
        }
    }
});

allan

If its only a single column you are restoring (s.id in the above case), then you probably don't need the forEach loop. Is it only a single column you want to restore?

Allan

CharlyPoppins

In this case yes, but on others dataTables I'll have multiple <select> filters.

So in this case I should have done :

dtTableAPI = $("#table").DataTable();
var myValue = dtTableAPI.state().columns[dtTableAPI.column('s.id:name').index()].search.search;

Thanks for your help :)