如何选中jquery数据表中的每个复选框

How to check every checkboxes in a jquery datatable?

本文关键字:复选框 何选中 jquery 数据表      更新时间:2023-09-26

我有一个表,第一列有复选框。我使用jQueryDataTable插件显示我的表。

我制作了2个链接来选择/取消选择每个复选框。这是一个选择所有:

<a href="" name="CheckAll" onClick="checkAll(document.email_list_form_inviter.getElementsByClassName(''email_checkbox''), event)" >Select all</a>

和javascript:

function checkAll(field, event) {
    event.preventDefault();
    for (i = 0; i < field.length; i++)
        field[i].checked = true ;
    return false;
}

但是数据表允许分页,我的函数只选择可见的复选框,而不选择其他页面的复选框。如何选择数据表中的每个复选框?

解决方案:

好的,我用fnGetNodes做到了,谢谢amccausl!

$("a[name='CheckAll']").click(function(event) {
        event.preventDefault();
        var nodes = datatable.fnGetNodes( );
        $('.email_checkbox', nodes).attr("checked", "checked");
    });

您可以使用fnGetNodes来获取所需的所有节点,而不是使用getElementsByClassName。

您还应该使用jquery.click()事件,而不是定义onClick自己的

这是我的解决方案(DataTable1.9.4):

var nodes = $('#listContainer').DataTable().column(0).nodes();
    $(':checked', nodes).each(function (index) {
        console.log($(this).text())
    })

对不起,我的代码错了:

动态复选框

return '<input type="checkbox" id="email_checkbox" name="email_checkbox"  />';

链接

<a href="" name="CheckAll" id="CheckAll">seleccionar todos</a>

姓名表:

<table cellpadding="0" cellspacing="0" border="0" class="display" id="example" width="100%">

和代码

$(document).ready(function() {
$("a[name='CheckAll']").click(function(event) {
                event.preventDefault();
                var nodes =  $('#example').fnGetNodes( );
                $('.email_checkbox', nodes).attr("checked", "checked");
} );
$(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");
             }
});