Home > jquery > JQuery DataTables column filters state saving

JQuery DataTables column filters state saving

The JQuery DataTables plugin supports state saving for column filters. But it does not automatically set the column filter values to the saved values when the user navigates to a page that has saved filter state.

I saw the code suggested here and cleaned it up a little (for example, using the oSettings parameter of the fnInitComplete function).

$(document).ready(function() {

        var oTable = $('#REPLACE_THIS_WITH_TABLE_ID').dataTable({
            "bStateSave": true,
            "fnInitComplete": function(oSettings, json) {
                var cols = oSettings.aoPreSearchCols;
                for (var i = 0; i < cols.length; i++) {
                    var value = cols[i].sSearch;
                    if (value.length > 0) {
                        $("tfoot input")[i].value = value;
                    }
                }
            }
        });

        $("tfoot input").keyup(function () {
            oTable.fnFilter(this.value, $("tfoot input").index(this));
        });
    });

Please note that I completely removed all code that supported initial display texts in the filter fields (because I don’t use that).

Advertisements
Categories: jquery
  1. November 27, 2015 at 10:07

    Saved the day xD

  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: