JohnZhang
JohnZhang

Reputation: 191

How to set row background color in dojo grid dynamically

I am using Dojo 1.10, have a simple dojox.grid.DataGrid, and want to change the background color as well as font color based on data.

I wrote a onStyleRow function myStyleRow(row){ var item = grid.getItem(row.index); if(!item) return;

var mappingFlag = store.getValue(item, "flag", null);
var mappingId = store.getValue(item, "matched_mapping_id", null);

if(mappingFlag == 0){
    row.customStyles += " color:black;";
}else if(mappingFlag == 1){
    row.customStyles += " color:gray;";
}else if(mappingFlag == 2){
    row.customStyles += " color:red;";
}else if(mappingFlag == 3){
    if(mappingId == currentMappingId){
        row.customStyles += " color:blue; background-color:#fff000;";
    }else{                
        row.customStyles += " color:blue; background-color:#ffffff;"; 
    }
}

grid.focus.styleRow(row);
grid.edit.styleRow(row);

}

What drive me to chaos is that the font color (blue/red/gray) are well set and displayed, but the background color does not take any effect...

What's wrong to my code? how I can change the row background color?

Many thanks!

Upvotes: 0

Views: 3843

Answers (2)

user7694885
user7694885

Reputation: 1

first, overwrite the background-color of dojoxGridRow to transparent. then, set the background color of row to what you want by setting grid.getRowNode(rowIndex).runtimeStyle.backgroundColor = color

Upvotes: 0

GoinOff
GoinOff

Reputation: 1802

Here are a couple of documents that should help you out:

Dojo Data Grid – Part 32: Setting Row Color Based on Row Data:

http://xcellerant.net/2013/11/20/dojo-data-grid-30-setting-row-color-dynamically/

and....

Dojo Data Grid – Part 34: Customizing Cell Styles Based on Data:

http://xcellerant.net/2014/01/15/dojo-data-grid-part-34-customizing-cell-styles-based-on-data/

Upvotes: 1

Related Questions