select all上的演示并不真正有效。https://datatables.net/extensions/select/examples/initialisation/checkbox.html
在通过columnDef属性创建所有复选框之后,实现select所有复选框的最佳方法是什么?
发布于 2017-03-03 13:23:56
这应该适用于你:
let example = $('#example').DataTable({
columnDefs: [{
orderable: false,
className: 'select-checkbox',
targets: 0
}],
select: {
style: 'os',
selector: 'td:first-child'
},
order: [
[1, 'asc']
]
});
example.on("click", "th.select-checkbox", function() {
if ($("th.select-checkbox").hasClass("selected")) {
example.rows().deselect();
$("th.select-checkbox").removeClass("selected");
} else {
example.rows().select();
$("th.select-checkbox").addClass("selected");
}
}).on("select deselect", function() {
("Some selection or deselection going on")
if (example.rows({
selected: true
}).count() !== example.rows().count()) {
$("th.select-checkbox").removeClass("selected");
} else {
$("th.select-checkbox").addClass("selected");
}
});不过,我已经添加到CSS中了:
table.dataTable tr th.select-checkbox.selected::after {
content: "✔";
margin-top: -11px;
margin-left: -4px;
text-align: center;
text-shadow: rgb(176, 190, 217) 1px 1px, rgb(176, 190, 217) -1px -1px, rgb(176, 190, 217) 1px -1px, rgb(176, 190, 217) -1px 1px;
}工作JSFiddle,希望这会有所帮助。
发布于 2017-07-01 19:29:30
发布于 2018-04-05 08:57:54
您可以使用按钮使用这个选项 , dataTable 本身提供的。
dom: 'Bfrtip',
buttons: [
'selectAll',
'selectNone'
]'下面是一个示例代码
var tableFaculty = $('#tableFaculty').DataTable({
"columns": [
{
data: function (row, type, set) {
return '';
}
},
{data: "NAME"}
],
"columnDefs": [
{
orderable: false,
className: 'select-checkbox',
targets: 0
}
],
select: {
style: 'multi',
selector: 'td:first-child'
},
dom: 'Bfrtip',
buttons: [
'selectAll',
'selectNone'
],
"order": [[0, 'desc']]
});https://stackoverflow.com/questions/42570465
复制相似问题