I am using data table javascript Api. It is very simple to use. Just create an array and pass to data table. Working fine. No issue
我正在使用数据表javascript Api。它使用起来非常简单。只需创建一个数组并传递给数据表。工作正常。没有任何问题
Example:
<html>
<head>
<link rel="stylesheet" href="//cdn.datatables.net/1.10.5/css/jquery.dataTables.css"/>
<script type="text/javascript" src="//cdn.datatables.net/1.10.5/js/jquery.dataTables.min.js"></script>
<script type="text/javascript">
var dataSet = [[1,'some text1','some text1','some text1',1],[2,'some text2','some text2','some text2',0],[3,'some text3','some text3','some text3',1]];
$('#example').dataTable( {
"data": dataSet,
"columns": [
{ "title": "id" },
{ "title": "Name" },
{ "title": "Parent", "class": "center" },
{ "title": "Description" },
{ "title": "active", "class": "center","bSortable": false }
]
} );
</script>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"></table>
</body>
</html>
So I want to set a different color to a particular row based on condition.Here we have not any control over row. How ever i am trying row call back available in data table. But it always reflect to header..
所以我想根据条件为特定行设置不同的颜色。这里我们没有对行的任何控制。我怎么尝试在数据表中可用的行回调。但它始终反映到标题..
Thanks in adv for your time.
谢谢你的时间。
1 个解决方案
#1
2
As mentioned in the comments, you can use fnRowCallback for this.
如评论中所述,您可以使用fnRowCallback。
...
{ "title": "active", "class": "center","bSortable": false }
],
"fnRowCallback": function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
var status = aData[5];
// check the status
if(status = 'not active'){ // or whatever your status value is...
$(nRow).addClass('row-inactive');
}
}
This will add a class of row-inactive
to the current <tr>
. You'll obviously need a css class like .row-inactive td{background-color:red;}
to make it work.
这将向当前添加一类行无效。你显然需要一个像.row-inactive td {background-color:red;}这样的css类来使它工作。
#1
2
As mentioned in the comments, you can use fnRowCallback for this.
如评论中所述,您可以使用fnRowCallback。
...
{ "title": "active", "class": "center","bSortable": false }
],
"fnRowCallback": function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
var status = aData[5];
// check the status
if(status = 'not active'){ // or whatever your status value is...
$(nRow).addClass('row-inactive');
}
}
This will add a class of row-inactive
to the current <tr>
. You'll obviously need a css class like .row-inactive td{background-color:red;}
to make it work.
这将向当前添加一类行无效。你显然需要一个像.row-inactive td {background-color:red;}这样的css类来使它工作。