I have a table which is updated with ajax and after update it if sorted but I need to sort not a fixed column but the same column which was last clicked before update.
function tableUpdated() {
$(".tablesorter").trigger("update");
//alert($(".tablesorter").sorting);
var sorting = [[7, 0]];
$("table").trigger("sorton", [sorting]);
}
In my code above I need to put my selected column index instead of 7
I have a table which is updated with ajax and after update it if sorted but I need to sort not a fixed column but the same column which was last clicked before update.
function tableUpdated() {
$(".tablesorter").trigger("update");
//alert($(".tablesorter").sorting);
var sorting = [[7, 0]];
$("table").trigger("sorton", [sorting]);
}
In my code above I need to put my selected column index instead of 7
Share Improve this question asked Feb 18, 2010 at 12:47 HasanGHasanG 13.2k31 gold badges102 silver badges159 bronze badges6 Answers
Reset to default 6jQuery's .data()
will help you here. Whenever the user clicks to sort a table, store the columns on the table itself. Within the sort function, add this:
$("#table").data('sorting', selectedColumn);
Now the element with id="table"
has a property sorting
with the value of selectedColumn
. In tableUpdated, you can use this data:
function tableUpdated() {
$(".tablesorter").trigger("update");
var sorting = [[$("#table").data('sorting'), 0]];
$("#table").trigger("sorton", [sorting]);
}
Data added using .data()
can be even more complex, allowing you to add objects of data. See this page for more details.
Using your code, you can do something like this (suppose your table id is #list-table) to maintain current table sorting:
function tableUpdated() {
$("#list-table").trigger("update");
var sorting = $("#list-table").get(0).config.sortList;
$("#list-table").trigger("sorton", [sorting]);
}
you can pick it up on the 'sortEnd' event on your table:
var lastSortList;
$table.on('sortEnd', function(e) {
lastSortList = e.target.config.sortList;
});
After battling with this for a day or so I found the datatables plugin which has state saving out of the box. I hope this helps someone else.
Here you can order with the same column and add a new one to sorter
var sorting = $("table").get(0).config.sortList;
sorting.push([2,0]); // add an element to the array
$("table").trigger("sorton", [sorting]);
It might a bit less overhead to save the last sort only when starting ajax like this:
lastSortList=$("table")[0].config.sortList;
Then get it back in after update like this:
$("table").trigger("sorton", [lastSortList]);
Remember to declare the first line in the right scope though.