javascript 如何检查 jquery 数据表中的每个复选框?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/8881530/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to check every checkboxes in a jquery datatable?
提问by Alexis
I have a table with checkboxes in the first column. I use the jQuery DataTable plugin display my table.
我在第一列中有一个带有复选框的表格。我使用 jQuery DataTable 插件显示我的表格。
I made 2 links to select/unselect every checkboxes. Here's the one to select all :
我做了 2 个链接来选择/取消选择每个复选框。这是全选的一个:
<a href="" name="CheckAll" onClick="checkAll(document.email_list_form_inviter.getElementsByClassName(\'email_checkbox\'), event)" >Select all</a>
And the javascript :
和 javascript :
function checkAll(field, event) {
event.preventDefault();
for (i = 0; i < field.length; i++)
field[i].checked = true ;
return false;
}
But the datatable enables pagination and my function select only the visible checkboxes, not those of the other pages. How can do to select every checkboxes in my data table?
但是数据表启用了分页,我的函数只选择可见的复选框,而不是其他页面的复选框。如何选择我的数据表中的每个复选框?
Solution :
解决方案 :
Ok I did this with fnGetNodes, thank you amccausl!
好的,我用 fnGetNodes 做了这个,谢谢 amccausl!
$("a[name='CheckAll']").click(function(event) {
event.preventDefault();
var nodes = datatable.fnGetNodes( );
$('.email_checkbox', nodes).attr("checked", "checked");
});
采纳答案by amccausl
You can use fnGetNodesto grab all the nodes you need, instead of the getElementsByClassName.
您可以使用fnGetNodes来获取您需要的所有节点,而不是 getElementsByClassName。
You should also be using jquery.click() event instead of defining an onClick yourself
您还应该使用 jquery.click() 事件而不是自己定义 onClick
回答by bill
This is my solution (DataTables1.9.4):
这是我的解决方案(DataTables1.9.4):
var nodes = $('#listContainer').DataTable().column(0).nodes();
$(':checked', nodes).each(function (index) {
console.log($(this).text())
})
回答by user1930790
Excuse me, my code is wrong :
对不起,我的代码是错误的:
The dynamic checkbox
动态复选框
return '<input type="checkbox" id="email_checkbox" name="email_checkbox" />';
The link
链接
<a href="" name="CheckAll" id="CheckAll">seleccionar todos</a>
the name′s table:
姓名表:
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example" width="100%">
and the code
和代码
$(document).ready(function() {
$("a[name='CheckAll']").click(function(event) {
event.preventDefault();
var nodes = $('#example').fnGetNodes( );
$('.email_checkbox', nodes).attr("checked", "checked");
} );
回答by sara191186
$(document).ready(function() {
$(".checkall").click(function(event) {
event.preventDefault();
var oTable = $('#example').dataTable();
var nNodes = oTable.fnGetNodes();
$email_box=$('.email_checkbox',nNodes);
if($email_box.attr("checked")=="checked"){
$email_box.removeAttr("checked");
$(".checkall").text("Check all");
}
else{
$email_box.attr("checked", "checked");
$(".checkall").text("Uncheck all");
}
});