I am trying to make a legend using a DataGrid . My problem is, I want the text in the Datagrid to be colored. I use the onStyleRow function as outlined here: (http://dojotoolkit.org/refer开发者_运维技巧ence-guide/dojox/grid/DataGrid.html) and it works the first time after deploying. The text in the DataGrid comes up red, but if i refresh or open try it on a different browser, the DataGrid text does not come up red, just the standard black.
I was wondering, what I was doing wrong, Thanks, Here is my code:
if(dijit.byId("plotlegend")){
dijit.byId("plotlegend").destroy();
}
var threadGrid = new dojox.grid.DataGrid({
id: 'plotlegend',
store: oStore,
structure: layout,
rowsPerPage: 5,
rowSelector: false,
autoWidth: true,
query: {},
plotsObject: this.plotsObject,
onStyleRow: function(row){
var legend = this;
var item = legend.getItem(row.index);
if (item){
var variableName = legend.store.getValue(item, "plot");
if (variableName){
var color = "color:red;";
row.customStyles += color;
}
}
legend.focus.styleRow(row);
legend.edit.styleRow(row);
}
},document.createElement('div'));
dojo.byId("plotlegendbc").appendChild(threadGrid.domNode);
threadGrid.startup();
threadGrid.update();
Not sure if this will solve your issue, but it's better if the last line of your custom style function is: dojox.grid.DataGrid.prototype.onStyleRow.apply(this, arguments);
(Remove the grid.focus.styleRow and grid.focus.edit.styleRow lines) This code will be more forward compatible since it runs the default onStyleRow function directly.
I have had more success in using dojo.connect to handle this event and properly apply styles. I haven't used the individual styles as CSS classes are a better way to manage styles. It is better for maintenance because then you don't have individual styles embedded in your JavaScript. Here's a snippet of what works for me. Keep in mind this is on Dojo 1.5.
var grid = dijit.byId('myDataGrid');
dojo.connect(grid, 'onStyleRow' , this, function(row) {
var item = grid.getItem(row.index);
if (item) {
if(item.status != "viewed"){
row.customClasses += " unRead";
}else{
row.customClasses += " read";
}
if(item.status == "not active"){
row.customClasses += " dismissed";
}
}
grid.focus.styleRow(row);
grid.edit.styleRow(row);
});
精彩评论