Reputation: 191
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
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
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