参考表分类2.0: http://mottie.github.io/tablesorter/docs/index.html
我没有使用Table Sorter 2.0的内置过滤器。我实际上必须使用备用文本框进行排序。现在,他们工作得很好。但问题是我需要一个重置按钮:
表格分类器只是告诉我们将“重置”类添加到按钮 - 这将重置过滤器。问题是我无法将所有文本框值都设置为null。
使用表格分类器的表具有id(#modelSearchTable)
我创建的文本框有class('modx')
有谁知道我怎么能有一个按钮:
(1)将所有文本框(类'modx')设置为值'' (2)重置表格排序器中的过滤器(id ='modelSearchTable')
$(".tablesorter").tablesorter({
theme: 'blue',
widthFixed : false,
widgets: ["zebra", "filter", "scroller"],
widgetOptions : {
filter_childRows : false,
filter_columnFilters : true,
filter_cssFilter : '',
filter_filteredRow : 'filtered',
filter_formatter : null,
filter_functions : null,
filter_hideFilters : true,
filter_ignoreCase : true,
filter_liveSearch : true,
filter_reset : 'button.reset',
filter_saveFilters : true,
filter_searchDelay : 300,
filter_serversideFiltering: false,
filter_startsWith : false,
filter_useParsedData : false
}
});
$(function(){
$("#modelSearchTable").tablesorter({ sortList: [[1,0], [0,0]] });
});
var i, id, myval, x, x2, x3, x4,itemval;
var arrval = new Array();
var arrpos = new Array();
//This function uses the values of my textboxes (not the built-in filters) to sort the table
$('.modx').keyup(function() {
var len = this.value.length;
x = parseInt($(this).attr('data-length'));
var a = x - 1;
if (len > a) {
this.value = this.value.substring(0,x);
this.value = this.value.toUpperCase();
var ntabindex = parseFloat($(this).attr('tabindex'));
ntabindex++;
$('input[tabindex='+ntabindex+']').focus();
} else {}
this.value = this.value.toUpperCase();
arrval = [];
arrpos = [];
$(this).attr('data-log', '1');
$('.modx').each(function() {
if ($(this).attr('data-log') == 1) {
arrval.push($(this).val());
arrpos.push($(this).attr('data-val'));
} else {}
});
$('#modelSearchTable tbody tr').hide().filter(function () {
var tValue = $(this).find('td:nth-child(2)').text();
for (var i = 0, l = arrpos.length; i < l; i++) {
if (tValue.substr(arrpos[i], arrval[i].length) !== arrval[i]) {
return false;
}
}
return true;
}).show();
});
答案 0 :(得分:3)
您可以绑定到相同的重置按钮,以便清除表格过滤器和特定文本区域:
$(function(){
$(".tablesorter").tablesorter({
theme: 'blue',
widthFixed : false,
widgets: ["zebra", "filter", "scroller"],
widgetOptions : {
filter_reset : 'button.reset'
}
});
$('button.reset').on('click', function(){
// clear textareas
$('.modx').val('').trigger('keyup');
});
});