Unable to get createdCell to manipulate css on DataTables 2.0.0
Unable to get createdCell to manipulate css on DataTables 2.0.0
In previous versions on Datatables the following code set the background color to red on all cells. But on DataTables v2 the cells stays white. I don't get any error message, where to search for a change in the background code to get the css manipulation with createdCell to work again?
(The example is a much simplified version, usually we need to set individual cell colors for larger tables with several rows and columns)
<html>
<head>
<script type="text/javascript" src="../lib/jquery/jquery-3.7.1.min.js"></script>
<!--
<link rel="stylesheet" href="../lib/DataTables/datatables.css">
<script type="text/javascript" src="../lib/DataTables/datatables.js"></script>
-->
<link rel="stylesheet" href="https://cdn.datatables.net/2.0.0/css/dataTables.dataTables.css" />
<script src="https://cdn.datatables.net/2.0.0/js/dataTables.js"></script>
<script>
tableData = {
columns :
[
{
"data" : "DT_RowId",
"title" : "DT_RowId",
"visible" : false
},
{
"data" : "Test",
"title" : "Test",
"visible" : true
}
],
data :
[
{
"DT_RowId" : 6,
"Test" : "0"
}
],
searching: false,
columnDefs: [
{
targets: '_all',
createdCell: function (td, cellData, rowData, row, col) {
$(td).css('background-color', 'red');
}
}
]
};
$(document).ready( function () {
$('#myTable').DataTable(tableData);
});
</script>
</head>
<body>
<table id="myTable"></table>
</body>
</html>
Edited by Kevin: Syntax highlighting. Details on how to highlight code using markdown can be found in this guide
This question has an accepted answers - jump to answer
Answers
I built a test case for you:
https://live.datatables.net/qinuceqe/1/edit
I added a second table to demonstrate the working case versus your non-working case.
It seems the problem occurs when using
columns.title
to create thethead
andth
elements. In this casecolumns.createdCell
doesn't fire. But if thethead
andth
s exist thencolumns.createdCell
fires and works.@allan will need to take a look.
Kevin
Thanks for super quick answer and helping setting up the test case. Looking forward for more answers to the underlying cause or a stable solution.
Many thanks for reporting this @henrik k and Kevin for the test case! It certainly does look like a bug. I'll dig into it and report back (if not tomorrow, then Tuesday).
Allan
It was the
_all
target on a table with no HTML columns that was causing the issue. I've committed a fix (and tests) to address this.The fix will be in 2.0.1 which I'll drop in the next few days.
Thanks again for flagging this up and also Kevin for the investigation.
Regards,
Allan