Change column color based on header value

I have the following code to change the row colors based on a cell value:

var levelColors=[null,'yellow','#99CCFF','#99CC00'];
grid.defineRowProperty("rowcolor", function(row){
return levelColors[this.getCellValue(0, row)];
grid.getRowTemplate().setStyle("background-color", function(){
return this.getRowProperty("rowcolor");

I'd also like to change the column's background color based on a value (this time the header for that column). I've tried doing something like:

grid.defineColumnProperty("colcolor", function(col) {
return "blue";
grid.getColumnTemplate().setStyle("background-color", function() {
return this.getColumnProperty("colcolor");

February 4,
Try this way:
grid.defineCellProperty("colcolor", function(col) {
return col%2?"blue":"yellow";
grid.getCellTemplate().setStyle("background-color", function() {
return this.getCellProperty("colcolor");
February 5,
Awesome, that totally worked. Thanks!
February 5,

This topic is archived.

See also:

Back to support forum