Reputation: 218
I want to change color of row in jquery datatable.net based on row's column value in fnRowCallback but its not working. Can any one help?
var xref_table = $('#grid_table').dataTable({
"bStateSave": true,
"bDestroy": true,
"bJQueryUI": true,
"sAjaxSource" : 'include/admin/xref_topic_product_add.php?grid=1',
"aoColumns": [
{ "mDataProp": "topic_name",sWidth:'200px' },
{ "mDataProp": "product_name", sWidth: '100px'},
{
"mDataProp": "product_id" ,
fnRender: function(row)
{
if( row.aData.product_id === null)
return '<button class="add_button" data_topic_id="'+ row.aData.topic_id + '" data_product_id="'+ row.aData.product_id + '" >Add</button>';
else
return '<button class="delete_button" data_topic_id="'+ row.aData.topic_id + '" data_product_id="'+ row.aData.product_id + '" >Delete</button>';
},
sWidth: '50px'
},
],
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
if(aData[3] === null){
$(nRow).css({"background-color":"red"});
}
return nRow;
}
});
Upvotes: 2
Views: 4899
Reputation: 3950
Normally you can change the bg-color like this:
$(nRow).css("background-color","red");
or
$(nRow).css("background-color","#ff0000");
I don't know if nRow
holds a correct representation of the element though, I can't see that here, that's your responsibility.
Upvotes: 3