我正在寻找一种对 jQuery TableSorter 中的多个列进行 OR 过滤的方法，就像 DataTable Multiple column OR filter 一样。我升级到 2.21.5。
我有一个fiddle example。我试过做filter_functions:
filter_functions: {
'.filter-OR': function (e, n, f, i, $r, c) {
/*
manually check the row for all columns
with a class of filter-OR
*/
}
}
但是将函数应用于任何类都会覆盖 filter-availOnly 选项。
不知道如何继续前进。
【问题讨论】：
标签： javascript jquery filter tablesorter
使用 filter_functions 的方式与您在示例中使用它的方式有点不同。
您必须提供将应用过滤器功能的列以及表示将触发该功能的选择值的键。
您可以通过一个对象的形式来执行此操作，该对象的键是列，这些键的值是另一个对象，其键是选择的值，这些键的值是将被触发的函数。
例如：
filter_functions: {
1: {// Column one...
"Yes" : function() {},//... will trigger the anonymous function when "Yes" is selected.
"No" : function() {}//... will trigger the anonymous function when "No" is selected.
}
}
如果你想要一个 OR，你可以这样做：
function (e, n, f, i, $r, c) {
return $r.find("td")// For all the tds of this row
.not(":first")// Avoid checking the first one (usually the ID)
.filter(function (_, el) {// filter all tds which value differs from "Yes"
return $(el).text() === "Yes";
})
.length > 0;// If length is bigger than one it means we have at least one "Yes", therefore we tell tablesorter not to filter this row.
};
同样适用于“否”，只是我们更改了要检查的值。 把所有东西都包起来，让它更整洁一点：
var checker = function (value) {
return function (e, n, f, i, $r, c) {
return $r.find("td")
.not(":first")
.filter(function (_, el) {
return $(el).text() === value;
})
.length > 0;
};
}, objChecker = function () {
return {
"Yes": checker("Yes"),
"No": checker("No")
};
};
$('table').tablesorter({
// Here goes your code to set up the table sorter ...
filter_functions: {
1: objChecker(),
2: objChecker(),
3: objChecker()
}
}
});
您可以在这个 fiddle
中查看希望对你有帮助。
【讨论】：
如果我理解请求，也许可以尝试这样的事情 (demo)：
$(function () {
var $table = $('table'),
// get 'filter-OR' column indexes
orColumns = $('.filter-OR').map(function (i) {
return this.cellIndex;
}).get(),
filterfxn = function (e, n, f, i, $r, c) {
var col, v,
showRow = false,
content = [];
$r.children().filter(function (indx) {
if (orColumns.indexOf(indx) > -1) {
v = (c.$filters.eq(indx).find('.tablesorter-filter').val() || '').toLowerCase();
showRow = showRow || $(this).text().toLowerCase() === v;
}
});
return showRow;
};
$table.tablesorter({
theme: 'green',
widgets: ['uitheme', 'zebra', 'columns', 'filter'],
sortReset: true,
sortRestart: true,
widthFixed: true,
widgetOptions: {
filter_functions: {
'.filter-OR': {
'Yes': filterfxn,
'No' : filterfxn
}
}
}
});
});
【讨论】：