Changing Color/Font on per-cell basis

Version 1.0 had examples of changing a text forground color on a per-cell basis based on a callback that evaluated the data (see 1.0 example below)

QUESTION: How is the same thing done in Version 2.0?

Version 1.0 Method:
function myColor(){
var value = this.getItemProperty("text") + "";
if (value.indexOf("Under Performing") != -1)
return "red"
return "black";
obj.getColumnTemplate(4).setStyle("color", myColor);

David Parr
November 2,
Found the code below in "October 10, 2005" comment to "Alternative" message thread from "Alex" - thank you.

The code below works fine; please comment if I shouldn't be taking this approach.

// setup 10 by 10 grid
var obj = new AW.UI.Grid;
obj.setCellText(function(col, row){return col + "." + row});

// manually set column-0 background-color
obj.getCellTemplate(0).setStyle("background-color", "yellow");

// add new cell properties for foreground/background colors
obj.defineCellProperty("background-color", function(col, row){
var text = this.getCellText(col, row);
return text.match(/[234]/) ? "red" : "white";
obj.defineCellProperty("color", function(col, row){
var text = this.getCellText(col, row);
return text.match(/[345]/) ? "blue" : "green";

// assign background-color property to column-1 background
obj.getCellTemplate(1).setStyle("background-color", function(){
return this.getControlProperty("background-color");

// assign color property to column-2 color
obj.getCellTemplate(2).setStyle("color", function(){
return this.getControlProperty("color");

David Parr
November 2,
Yes, this should work with 2.0
Alex (ActiveWidgets)
November 2,
after document.write(obj);, it not effect...how to fix this problem ???
November 17,
Should this work with a AW.Grid.Extended. I tried the defineCellProperty step to color rows, but it had no effect. One difference is that I am not using an AW.UI.Grid. Does this matter?
Paul Tiseo
November 27,

This topic is archived.

See also:

Back to support forum