Javascript 带有Tablescroller小部件的Tablesorter JS,在多列中带有多个复选框的列冻结
我目前正在处理一个主要处理数据库的项目,我使用TableSorterJS插件来填充我的表。我想要实现的是一个具有多个固定列的表,并且在可滚动部分的多列中有多个复选框。我使用Tablesorter引导主题作为表格样式。我遵循了这个JSFIDLE和Tablesorter小部件滚动器示例 问题是,如果启用Javascript 带有Tablescroller小部件的Tablesorter JS,在多列中带有多个复选框的列冻结,javascript,jquery,checkbox,tablesorter,Javascript,Jquery,Checkbox,Tablesorter,我目前正在处理一个主要处理数据库的项目,我使用TableSorterJS插件来填充我的表。我想要实现的是一个具有多个固定列的表,并且在可滚动部分的多列中有多个复选框。我使用Tablesorter引导主题作为表格样式。我遵循了这个JSFIDLE和Tablesorter小部件滚动器示例 问题是,如果启用滚动条\u fixedColumns:,则选中所有复选框(在中)不起作用[column 4]。以及如何使所有“全选”复选框在多列[第4列、第5列、第6列,…]中工作 这是我的 非常感谢你的帮助!非常感
滚动条\u fixedColumns:
,则选中所有复选框(在
中)不起作用[column 4]。以及如何使所有“全选”复选框在多列[第4列、第5列、第6列,…]中工作
这是我的
非常感谢你的帮助!非常感谢。以-
相关代码如下。确保包括以下内容:
$('table').tablesorter({
主题:“引导”,
度假村:错,
是的,
headerTemplate:“{content}{icon}”,
小部件:[“uitheme”、“filter”、“zebra”、“scroller”],
widgetOptions:{
过滤器重置:“.reset”,
过滤器\u cssFilter:“表单控件”,
滚动条固定列:3,
},
标题:{
'.action':{sorter:'复选框'}
},
初始化:函数(表){
$(table).closest('.tablesorter scroller')。在('change','thead th.action input[type=checkbox]'上,函数(){
var indx,
$this=$(this),
checkboxColumn=parseInt($this.closest('th,td').attr('data-column'),10),
isChecked=此项已检查;
$cells=$(表)
.儿童(“tbody”)
.儿童(tr)
.children(':n个子项('+(checkboxColumn+1)+'))
.find('input'),
len=$cells.length;
对于(indx=0;indx
$('table').tablesorter({
theme: "bootstrap",
resort: false,
widthFixed: true,
headerTemplate: '{content} {icon}',
widgets: ["uitheme", "filter", "zebra", "scroller"],
widgetOptions: {
filter_reset: ".reset",
filter_cssFilter: "form-control",
scroller_fixedColumns: 3,
},
headers: {
'.action': { sorter: 'checkbox' }
},
initialized: function (table) {
$(table).closest('.tablesorter-scroller').on('change', 'thead th.action input[type=checkbox]', function () {
var indx,
$this = $(this),
checkboxColumn = parseInt( $this.closest('th,td').attr('data-column'), 10 ),
isChecked = this.checked;
$cells = $(table)
.children('tbody')
.children('tr')
.children(':nth-child(' + (checkboxColumn + 1) + ')')
.find('input'),
len = $cells.length;
for ( indx = 0; indx < len; indx++ ) {
$cells.eq( indx )[0].checked = isChecked;
}
$(table).trigger('update');
});
}
});