javascript - 如何使用 datatables.js 将 Css 类应用于一行？

Question

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

这是我的 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');
            }
        }

    });
});      

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

    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']; 

Answer 1

我认为问题出在您认为您在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');
    }
}

或者，如果您想应用 css 列中包含的任何类:

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

参见 demo .