DataTable.js, Change the Color of Row based on the Cell Value
Suppose you wants to change the color of Table Row on the bases of column value, then we have to use rowCallback as the below code
rowCallback: function (row, data, index) {
if (data[3] ==="some value") {
$(row).css('color', 'red');
}
}
This code should be used like the below:
var table = $('#TableName').DataTable(
'paging': true,
'lengthChange': true,
'searching': true,
'ordering': true,
'info': true,
'autoWidth': false,
'ajax': 'JsonData.json',
'columnDefs': [{
'targets': -1,
'data': null,
'defaultContent': 'html">'
}],
dom: 'Bfrtip',
buttons: [{
extend: 'colvis',
text: 'Hide/Show Columns',
columnText: function (dt, idx, title) {
return (idx + 1) + ': ' + title;
}
}],
rowCallback: function (row, data, index) {
if (data[3] ==="some value") {
$(row).css('color', 'red');
}
}
})