如何使用datatables.js将Css类应用于行?

Adh*_*hik 1 javascript css jquery jquery-datatables

我从SQL过程中检索了包含要在该特定行上应用的类名称的列.
但是,该表作为数据源传递给datatable.js.现在使用我的代码,指定的类只应用于一个单元格:in fnRowCallback()function.我想要将该类应用于整行.

这是我的javascript代码:

var dataSet = JSON.parse("[" + a.toString() + "]")    
$(document).ready(function () {
    $('#demo').html('<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"></table>');

    $('#example').dataTable({
        "data": dataSet,                
        "columns": [
                        { "title": "Center" },
                        { "title": "Call Executive" },
                        { "title": "Name" },
                        { "title": "Mobile" },
                        { "title": "Phone" },
                        { "title": "Status" },
                        { "title": "Appt Date" },
                        { "title": "Joined Date" },
                        { "title": "Remark" },
                        { "title": "Source" },
                        { "title": "Publisher" },
                        { "title": "css" },
                      ]
                      ,
        "fnRowCallback": function (nRow, aData, iDisplayIndex) {
            if (aData["css"] == "gradeC") {
                $(nRow).addClass('gradeC');
            }
            else {
                $(nRow).addClass('gradeN');
            }
        }

    });
});      
Run Code Online (Sandbox Code Playgroud)

传递给函数的示例Datatable字符串(在最后一列中指定了类)是:

    var dataSet = ['Dadar', 'lmsSenitaD', 'Atul salaskar', '9876543210', '', 'Not Joined', '10/01/2014', '', 'Come back and Join', 'Mobile', 'Times','gradeC'],
['Aundh', 'Rashmi', 'Preeti Gupta', '9876543210', '', 'Not Joined', '10/01/2014', '', 'Will Discuss with Family', 'Online Campaign', 'Iksula','gradeN'],
['Do@Home_Thane', 'Rashmi', 'Mitali Gupta', '9876543210', '', 'Joined - Old Date', '10/01/2014', '20/08/2014', 'Come back and Join', 'Online Campaign', 'Iksula','gradeC']; 
Run Code Online (Sandbox Code Playgroud)

dre*_*cat 7

我认为问题来自你认为你进入的东西aData.当fnRowCallback调用回调时,aData不是具有与列标题对应的键的对象.它只是与该行对应的数据(数组).与您传递的数组完全相同的数组dataSet.因此,如果要获取css列,则需要知道数组中该列的索引.在你的情况下似乎很容易,因为它恰好是最后一个.所以你可以做这样的事情来获得css类名:

"fnRowCallback": function (nRow, aData, iDisplayIndex) {
    var css = aData[aData.length - 1];
    if (css == "gradeC") {
        $(nRow).addClass('gradeC');
    }
    else {
        $(nRow).addClass('gradeN');
    }
}
Run Code Online (Sandbox Code Playgroud)

或者,如果要应用css列中包含的任何类:

"fnRowCallback": function (nRow, aData, iDisplayIndex) {
    $(nRow).addClass(aData[aData.length - 1]);
}
Run Code Online (Sandbox Code Playgroud)

演示.