CODEWITHSUNDEEP
javascriptdatatables
Mark Nenadov
Mark Nenadov

Reputation: 6917

Altering the Coloring of Arbitrary Cells in DataTables

I have a DataTables table. Here's a simplified version of what I have as a result:

$('#dt_list').html( '<table cellpadding="0" cellspacing="0" border="1" class="content" id="test"></table>' );

$('#test').dataTable( {
    "bAutoWidth": true
    "aaData": [ 'val1', 'val2', 'val3' ],
    "aoColumns": [ 'col1', 'col2', 'col3' ],

});

...stuff here..

<div id='dt_list'></div>

The JavaScript arrays are generated by a Python script based on values extracted from a MySQL database (it would be otherwise irrelevant, but I just want to make sure people reading this know that I'm dynamically generating the content arrays outside of JavaScript).

As I've said, the data being displayed on this table is the result of a MySQL query that is then processed by Python and output into the JavaScript in the page generated by Python.

I have logic in my Python code to determine not only what value goes into a cell, but also whether the cell requires any highlighting (via the cell's background color). My question here is, how can I arbitrarily change the color on certain DataTable cells?

Since most of my logic is in Python, I don't really need anything very fancy or elegant evaluations in the JavaScript, I just need some sort of way in JavaScript to manipulate a cell's CSS property or in some other way indicate a different coloring.

I've looked into fnRender and it seems my best hope. However, my two issues at this point are (a) I can't find a way to manipulate the color from within an fnRender function (it seems to be more targeted to manipulating the content itself) and (b) I'm unsure how I'd be able to have fnRender know the result of the Python operation to determine whether special coloring is needed.

Is there something I'm missing? Or maybe I just need to re-think how I am approaching this? Ideally I'd like a solution to this that doesn't involve reworking the way I'm doing this, but I'll change the way I generate the data or pass it if I must. I'm modifying some existing code and would rather not mess with the existing design, but take the shortest, easiest path to converting its table listing output to DataTables, and part of that is generating certain cells as having a modified color.

Upvotes: 0

Views: 468

Answers (1)

Pointy
Pointy

Reputation: 413712

Your "fnRender" callback can return cell contents wrapped in a marker <span> or <div> (or whatever). You can then use the fnDrawCallback function to find those and tag the parent <td> element with a class.

Upvotes: 1

Related Questions