带有彩色行的jQuery数据表

时间:2012-05-26 18:56:15

标签: php javascript jquery datatable

我需要创建一个jQuery数据表,其中某些行可能具有灰色背景颜色 - 这意味着它们被禁用。仅当相应MySQL表的列“status”等于0时,行才能具有灰色背景。

请看下面的代码。列'10'被隐藏。它包含status值。如果为0,则该行应具有不同的背景颜色。但这不起作用。没有错误消息。有什么想法吗?

$(document).ready(function(){
              $('#newspaper-b').dataTable({
              "sPaginationType":"full_numbers",
              "aaSorting":[[4, "asc"]],
              "aoColumns": [null,null,null,null,null,null,null,null,null,null,
                            {"bSearchable": true, "bVisible": false},null,null],
              "bJQueryUI":true,
              'fnRowCallback': function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
                    if(aData[10]=="0"){
                        nRow.className = "disactivatedRow";
                    }
                    return nRow;
                }
              });

CSS

.disactivatedRow td { 
    background-color:#ffbba9 !important;
    color: #e6e6fa;
}
#newspaper-b {
    border-collapse: collapse;
    border-color: #B7DDF2;
    border-style: solid;
    border-width: 1px;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 11px;
    margin: 0;
    text-align: left;
    width: 480px;
}
#newspaper-b th {
    background: none repeat scroll 0 0 #EBF4FB;
    border-color: lightgray;
    font-size: 11px;
    font-weight: bold;
    padding: 15px 10px 10px;
}
#newspaper-b tbody tr td {
    background: none repeat scroll 0 0 #FFFFFF;
}
#newspaper-b td {
    border-top: 1px dashed #FFFFFF;
    color: #000000;
    padding: 10px;
}
#newspaper-b tbody tr:hover td {
    background: none repeat scroll 0 0 #FFCF8B;
    color: #000000;
}
#newspaper-b tbody tr.selected td {
    background: none repeat scroll 0 0 #FFCF8B;
    color: #000000;
}

1 个答案:

答案 0 :(得分:2)

行没有内容因此背景,td应该是彩色的:

.disactivatedRow td { 
    background-color:#ffbba9 !important;
    color: #e6e6fa;
}

如果仍然没有解决,我建议你在你的if之外的console.log(aData [10])。要使console.log工作使用Chrome / Firefox,通过F12查找控制台输出并查看aData [10]包含的内容,可能需要aData [9](程序员用来从零开始计算;)。