行复选框在jQuery数据表中不起作用

时间:2014-11-18 05:58:01

标签: javascript c# jquery asp.net-mvc datatable

我正在使用带有复选框列的jQuery数据表来选择

中的选中的行值

按钮点击事件。请看下面的图片。

enter image description here

我使用此代码获取检查行

        var checkedRows = dtTable._('tr.checked', { "filter": "applied" });

我的问题是,当我点击标题行复选框时,它可以正常工作。但它显示为空

单击

复选框单击。我很无能。

修改

萤火虫

enter image description here

JQuery的

var dtTable = null;
var ajaxUrl = "";

$(document).ready(function () {

    GetCustomerAcceptence();

    $("#btnReceived").click(function () {

        var checkedRows = dtTable._('tr.checked', { "filter": "applied" });

        if (checkedRows == null) {
            alert("checkedRows is null.");
        }
        else {
            alert("checkedRows is not null. Value : " + checkedRows[0][1]);
        }
    });

    function GetCustomerAcceptence() {

        /* Clear datatable before reload. */

        ClearDataTable();

        var elementName = "";

        ajaxUrl = "";

        elementName = "#tblCustomerAcceptence";

        ajaxUrl = '@Url.Action("GetCustomerAcceptenceOrders", "Dispatch")';

        dtTable = $(elementName).dataTable({
            bProcessing: false,
            bLengthChange: false,
            bInfo: false,
            bFilter: false,
            bPaginate: false,
            sAjaxSource: ajaxUrl,
            aoColumns: [
                 {
                     "sClass": "checkbox-column",
                     bSortable: false,
                     "mRender": function (data, type, full) {
                         return '<input type="checkbox" onclick="check(this)" class="icheck-input">';
                     }
                 },
                 { sTitle: "Id", bSortable: false, bVisible: false },
                 { sTitle: "Number", bSortable: false, },
                 { sTitle: "Description", bFilterable: true, bSortable: false, },
                 { sTitle: "PoBox Number", bSortable: false, },
                 { sTitle: "Owner", bSortable: false, },
                 { sTitle: "Physical Weight", bSortable: false, },
                 { sTitle: "Vol.Weight", bSortable: false, },
                 { sTitle: "Last Status", bSortable: false, },
                 { sTitle: "Zone", bSortable: false, },
            ],
            "fnServerParams": function (aoData) {
                aoData.push(
                                { "name": "MasterAWB", "value": "0" },
                                { "name": "PoboxNumber", "value": "0" },
                                { "name": "TypeofGoods", "value": 0 },
                                { "name": "Provider", "value": 0 },
                                { "name": "DateFrom", "value": "0" },
                                { "name": "DateTo", "value": "0" },
                                { "name": "Zone", "value": 0 },
                                { "name": "BagNumber", "value": "0" }
                );
            },
        });
    }

    function ClearDataTable() {

        if (dtTable != null) {
            dtTable.dataTable().fnClearTable();
            dtTable.dataTable().fnDestroy();
        }

    }
});

请帮助。

1 个答案:

答案 0 :(得分:1)

我很遗憾地说复选框栏中有错误。我需要在我的网页中放置检查功能以激活复选框检查事件。

/* checkbox in table */

function check(e) {
    if ($(e).parent('td').parent('tr').hasClass('checked')) {
        $(e).parent('td').parent('tr').parent('tbody').parent('table').children('thead').find('th:first').children('div').removeClass('checked');
        $(e).parent('td').parent('tr').removeClass('checked');
    }
    else {
        $(e).parent('td').parent('tr').addClass('checked');
        dtTable.fnDraw();
    }
}

/* end */