在jQuery中条件检查“datatable复选框”

时间:2017-05-10 02:25:37

标签: javascript jquery checkbox datatables

您好我正在尝试创建一个包含复选框的表。每行都有自己的类和ID。

$('#niisPrprtyCoverageTable').dataTable({
    "data" : coverageList,
    "columns" : [ { 
        "data" : "seqNo",
     "visible" : false
    }, {
        "data" : "coverageCode"
    }, {
        "data" : "coverageName"
    }, {
        "data" : "coverageCode",
        "width" : "80px",
        "className" : "text-center",
        render : function(data, type, row) {
            var arrData = data.split(";");
            var coverageCd = arrData[0];
            var coverageRel = nvl(arrData[1], coverageCd);
            data = '<input class="'+coverageRel+'" id="'+coverageCd+'" type="checkbox" onClick="addToArray('
                + coverageCd
                + ','
                + coverageRel
                + ')">';
            return data;
        }
    } ],
    "searching" : false,
    "bLengthChange" : false,
    "iDisplayLength" : 15 ,
    "bSort" : false,
    "columnDefs" : [ {
        "targets" : [ 1, 2 ],
        "className" : "left"
    }, {
        "targets" : [ 2 ],
        "width" : "150px",
    }, {
        "targets" : [ 1 ],
        "width" : "100px",
    }, {
        "targets" : [ 3 ],
        "width" : "50px",
        "className" : "text-center"
    } ]
});
niisPrptyCoverageTable = $('#niisPrprtyCoverageTable').DataTable();

$('#select-all').on('click', function(){
    alert('ss');
    // Get all rows with search applied
    var rows = niisPrptyCoverageTable.rows({ 'search': 'applied' }).nodes();
    // Check/uncheck checkboxes for all rows in the table
    $('input[type="checkbox"]', rows).prop('checked', this.checked);
});

如果我检查主行,应该检查他的'code or id'下的所有行。

它可以工作但只在第一页上 enter image description here

但不适用于数据表的第二页 enter image description here

var array = [];
function addToArray(coverageCd, coverageRel) {
    var rows = niisPrptyCoverageTable.rows('.'+coverageRel).nodes().className;
    $('input[class='+coverageCd+']', rows).prop('checked', '#'+coverageCd.checked);
}

1 个答案:

答案 0 :(得分:1)

使用$() API方法访问所有网页上的元素,而不仅仅是当前页面。

例如:

var array = [];
function addToArray(coverageCd, coverageRel) {
    var rows = niisPrptyCoverageTable.rows('.'+coverageRel).nodes().className;
    niisPrptyCoverageTable.$('input[class='+coverageCd+']', rows).prop('checked', '#'+coverageCd.checked);
}

或者,请参阅jQuery DataTables Checkboxes扩展名,以便更轻松地处理由jQuery DataTables提供支持的表中的复选框。