JQuery DataTables fnCreatedCell not being called
I want to change the text color of a cell based on its value. However, the function is fnCreatedCell
not called when I add data to the table.
This is rather strange as I have used it fnCreatedRow
with success. However, this may only color the entire line, which is not the desired functionality.
I can see that the latter function is of type Callback whereas it fnCreatedCell
is of type Columns. So I guess I can't use fnCreatedCell
how fnCreatedRow
, but how can I use it?
Here is the code:
$(document).ready(function() {
$('#demo').html('<table cellpadding="0" cellspacing="0" border="0" class="display cell-border" id="example" ></table>');
t = $('#example').DataTable({
"columns":
[
{"title": "c1", "data": "c1" },
{"title": "c2", "data": "c2" },
],
"fnCreatedCell": function (nTd, sData, oData, iRow, iCol)
{
console.log(sData, cData, 'TEST'); // not being done
if (sData > 30)
{
$(nTd).css('color', 'blue')
}
}
});
});
source to share
"The" Columns "type means that it is part of the columns
/ structures columnDefs
, that is, you have fnCreatedCell
(from 1.10.x as you use it, you can name it createdCell
) for each individual column.
t = $('#example').DataTable({
"columns": [
{"title": "c1", "data": "c1" },
{"title": "c2",
"data": "c2",
"fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
console.log(sData, cData, 'TEST'); // not being done
if (sData > 30) {
$(nTd).css('color', 'blue')
}
}
}
]
});
source to share
fnCreatedCell
should be used for each column. This is not a generic implementation for the entire database. Please use the version below.
t = $('#example').DataTable({
"columns": [
{"title": "c1", "data": "c1",
"fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
console.log("fnCreatedCell");
}
},
{"title": "c2", "data": "c2"}
]
});
source to share