jquery - 基于 jQuery dataTable 中未发生的单元格值的行突出显示

Question

我正在尝试根据单元格的值突出显示 dataTable 中的一行。但奇怪的是，即使满足应用条件，也不会应用 css。数据表正确显示数据，但行突出显示没有发生。请告诉我哪里出错了。 fyi..我正在使用客户端数据表。

谢谢!!下面是我的代码:

jQuery:

    //data to be added to dataTable is added into the html table before this line.
    oTableQ= $('#myDataTable').dataTable({
            "sPaginationType": "full_numbers",
            "bLengthChange":false,
            "bInfo": true,
            "columns": [
                    null,
                    null,
                null,
                    null,
                null,
                null,
                null,
                null,
                null,
                { "visible": false }
        ],
        "createdRow": function( row, data, dataIndex ) {
            if ( data[9] == "ACTIVE" ) {
              $(row).addClass('highlightRow'); //this line has no effect on the page even if the 'if' condition is satisfied.
              console.log(" row text is : "+ $(row).text() + "data at 9th column : " + data[9]);
            }
            },

            "iDisplayLength":10
             });

CSS:

    .highlightRow {
    background-color:   #ffaabb;

Answer 1

对数据表 1.9 使用 fnRowCallback

...
  { "visible": false }
  ],
"fnRowCallback": function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
 if ( aData[9] == "ACTIVE" ){         
    $(nRow).addClass('highlightRow');
  }
}

更新:我可以复制评论中描述的这个问题 - 我基本上无法将类应用于元素。要绕过它，您可以将该类应用于子元素。

尝试:

if ( aData[9] == "ACTIVE" ){ 
$(nRow).children().each(function (index, td) {
       $(this).addClass('highlightRow');
   });
}