具有自定义按钮文本和多列的外部筛选器
具有自定义按钮文本和多列的外部筛选器
提问于 2017-08-13 12:49:28
我正在使用Tablesorter，并希望为我的用户添加几个快捷按钮，以帮助他们填写过滤器框。如果按此处描述的方式使用按钮，则工作正常：
在这里：
我需要更改按钮的标签，即在与按钮标签不同的东西上过滤。我该怎么加这个？
此外:当按下不同的按钮时，如何启用多列的筛选？现在，当按下按钮时，所有其他过滤器都会被擦除。
用于使用外部按钮的按钮jQuery代码如下所示：
$('button').click(function(){
var $t = $(this),
col = $t.data('filter-column'), // zero-based index
filter = [];
filter[col] = $t.text(); // text to add to filter
$('#sorttable').trigger('search', [ filter ]);
return false;
});我会添加一个过滤器
<button class="btn btn-sm btn-primary" data-filter-column="1">50 - 59</button>
<button class="btn btn-sm btn-primary" data-filter-column="0">DIV</button>"DIV“文本，我想用其他的东西代替，同时仍然应用一个过滤器，它实际上是将"DIV”读到第0列，同时我不想删除第一个按钮可能添加到第1列的“50-59”过滤器。
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-08-13 16:11:14
您可以设置代码以从一个按钮(演示)获取一个或多个查询。
HTML
<button class="btn btn-sm btn-primary" data-filter-column="0,1" data-filter-query="abc,>50">Combo</button>脚本
$(function() {
$('button').click(function() {
var i,
$t = $(this),
col = $t.attr('data-filter-column').split(/\s*,\s*/), // zero-based index
query = $t.attr('data-filter-query').split(/\s*,\s*/),
filter = [];
for (i = 0; i < col.length; i++) {
var n = parseInt(col[i], 10);
filter[n] = query[i]; // text to add to filter
}
$('#sorttable').trigger('search', [filter]);
return false;
});
$('#sorttable').tablesorter({
theme: 'blue',
widgets: ['zebra', 'filter']
});
});或者，您可以使用内置方法搜索一系列列，请参阅这个演示。
Update:尝试使用每个按钮单击更新现有过滤器的这个演示。使用重置按钮清除所有内容。
$(function() {
var $table = $('#sorttable');
$('button:not(.reset)').click(function() {
var i,
$t = $(this),
col = $t.data('filter-column'), // zero-based index
query = $t.attr('data-filter-query'),
// get the current filter values
filter = $.tablesorter.getFilters($table);
filter[col] = query; // text to add to filter
$table.trigger('search', [filter]);
return false;
});
$table.tablesorter({
theme: 'blue',
widgets: ['zebra', 'filter'],
widgetOptions: {
filter_reset: '.reset'
}
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/45660521
复制相关文章
相似问题
腾讯云开发者
