Setting cell style, by adding a class via a column renderer?

bdp

I'm incorporating DataTables into an existing project where each table row has a state value. States display with background colors that are defined via CSS. I've created column render functions before, for example that add a link to the row detail item, but need to set the row's 'state column' background color.

It would seem that I could define a renderer that would allow me to set the cell's state by adding one of my predefined classes to it (I can derive it from the row data). What I'm missing is how to access the cell from the renderer.

bdp

I solved this via a hack.

I was able to use a renderer to write a span with the appropriate state class into each cell. The problem with that was that only the state text background displayed the state 'color'. I want the entire cell background to fill with the state color.

The hack was to find all of the spans, and replace their parent td's with that class once the DataTable was drawn. It is instantaneous even with large data sets.

Regardless, I'm still curious if there would be a way to do this in the DataTables column definition?

tbl.on('draw.dt', function() {

$('td span[class^="st_"]').each(function() {

var self = $(this);

var c = self.attr('class');

self.removeClass(c);

self.parent('td').addClass(c);

})

});

ps: Tried to format the code above w/o success.

allan

Hi,

The column.createdCell option might be what you are looking for if I understand correctly. With that you can set a class when the cell is created.

Allan

bdp

Allan,

That was what I was looking for. I can derive the class from rowData and add it to the cell td.