Question

I’m using the jQuery Tablesorter plugin to sort my tables and would like to save the choice inside a cookie using the jquery cookie plugin.

Has anyone done anything like this? Or would know how to do this?

I do the sorting using the click() event as my table is split up into parts e.g:

function setupTablesorter() {
    var currentSort;
    var cookieSortList = $.evalJSON($.cookie("table_sort_list"));
    if (cookieSortList == null)
        cookieSortList = [[1, 0]]

    $('table').each(function (i, e) {
        var myHeaders = {}
        $(this).find('th.nosort').each(function (i, e) {
            myHeaders[$(this).index()] = { sorter: false };
        });
        $(this).tablesorter({ sortList: cookieSortList, widgets: ['zebra'], headers: myHeaders }).bind("sortEnd", function (sorter) {
            currentSort = sorter.target.config.sortList;
        });
    });

    $(".uiGridHeader th").click(function () {
        $.cookie("table_sort_list", $.toJSON(currentSort));
    });

    console.log(currentSort);
}

function setupFixedHeader() {

    var copyThead = $(".uiGridContent thead").html();
    var copyCol = $(".uiGridContent colgroup").html();
    copyThead = '<table>' + copyCol + '<thead>' + copyThead + '</thead></table>';
    $(".uiGridHeader").html(copyThead);
    $(".uiGridContent table").tablesorter();
    $(".uiGridContent table thead").hide();
    function bindClick() {
        $(".uiGridHeader th").click(theadClick);
    }
    var direction = 0;
    function theadClick() {
        console.log('click');
        if (direction) {
            direction = 0;
        } else {
            direction = 1;
        }
        var index = $(this).index();
        var sorting = [[index, direction]];

        $(".uiGridContent table").trigger("sorton", [sorting]);

        var FindcopyThead = $(".uiGridContent thead").html();
        var FindcopyCol = $(".uiGridContent colgroup").html();
        var NewcopyThead = '<table>' + FindcopyCol + '<thead>' + FindcopyThead + '</thead></table>';
        $(".uiGridHeader").html(NewcopyThead);
        bindClick();
    }
    bindClick();
}

So somewhere in the function I need to record the choice in a cookie.

Answer 1

in your function you can add $.cookie("table_sort_list", sorting); just after your var sorting

and in you function where you init your table you could do something like

var cookieSortList= $.cookie("table_sort_list");
if(cookieSortList== null)
    cookieSortList = []

$("table").tablesorter({ 
    sortList: cookieSortList
}); 

Another, maybe beter way is getting the new sort order as described on jQuery tablesorter how to find sortList object