I use the tablesorter plugin and would like it to keep the filter value for the selected item after the item has been added via ajax.
"The selection is updated when new data is updated, however, if the option was selected by the user when the selection is populated, the selection of users will not be saved. For example, in your Fiddle - click" Bruce ", then click" Add row ". The parameter" Bruce "- reset, and the table is updated "
This is exactly the same as this question. I also asked a question in a comment, but have not heard it yet. Tablesorter jQuery Filter Feature Update
Any thoughts would be greatly appreciated.
Update: it looks like version 3 has a filter save widget. Has anyone got this job? see https://github.com/Mottie/tablesorter/issues/178
$ .tablesorter.addWidget ({
id: 'FilterSave',
format: function (table, init) {
var sl, time, c = table.config,
wo = c.widgetOptions,
ss = wo.FilterSave! == false; // make FilterSave active / inactive; default to true
var count_filters = $ (table) .find ('input.tablesorter-filter'). length;
var filter = new Array ();
for (var i = 0; i 0)
{
$ (table) .trigger ('search', [filter]);
}
}
},
remove: function (table, c, wo) {
// clear storage
$ .tablesorter.storage (table, 'tablesorter-savefilter', '');
}
});
Old example
(http://jsfiddle.net/4yKMq/) .
$(function() {
$("table").tablesorter({
theme: 'blue',
widthFixed : true,
widgets: ["zebra", "filter"],
widgetOptions : {
filter_cssFilter : 'tablesorter-filter',
filter_childRows : false,
filter_hideFilters : false,
filter_ignoreCase : true,
filter_reset : '.reset',
filter_searchDelay : 300,
filter_startsWith : false,
filter_hideFilters : false,
filter_functions : {
0 : true,
1 : function(e, n, f, i) {
return e === f;
},
2 : {
"A - D" : function(e, n, f, i) { return /^[A-D]/.test(e); },
"E - H" : function(e, n, f, i) { return /^[E-H]/.test(e); },
"I - L" : function(e, n, f, i) { return /^[I-L]/.test(e); },
"M - P" : function(e, n, f, i) { return /^[M-P]/.test(e); },
"Q - T" : function(e, n, f, i) { return /^[Q-T]/.test(e); },
"U - X" : function(e, n, f, i) { return /^[U-X]/.test(e); },
"Y - Z" : function(e, n, f, i) { return /^[Y-Z]/.test(e); }
},
4 : {
"< $10" : function(e, n, f, i) { return n < 10; },
"$10 - $100" : function(e, n, f, i) { return n >= 10 && n <=100; },
"> $100" : function(e, n, f, i) { return n > 100; }
}
}
}
});
$('button.add').click(function () {
var newRow = "<tr><td>James</td><td>Franco</td><td>Hollywood</td><td>31</td><td>$33.33</td><td>13%</td><td>Oct 22, 2010 1:25 PM</td></tr>";
$('table')
.find('tbody').append(newRow)
.trigger('update');
});