PDA

View Full Version : Grid row color



bkraut
28 Jan 2010, 2:16 PM
Hi,

I would like to know, how can I change a row color on a grid? I know I can do this by following code:



var gridView = new Ext.grid.GridView({
getRowClass : function (row, index) {
var data = row.data;
//if (data.dateOfValidity > new Date()) {
return 'x-gridrow-green';
/*} else {
return 'x-gridrow-red';
}*/
}
});


but I would like to assign a color like '#123456' to the row. The colors of specific rows are stored inside the database.

PCSpectra
28 Jan 2010, 5:38 PM
I'm confused, haven't you discovered the answer?

Seems to me you would simply make sure to pass along the color informaiton with the request to the data store and then pull on those values in the getRowClass() event???

Not an expert just trying to learn extJS inside and out by asking a lot of questions. :)

Cheers,
Alex

chesstrix
28 Jan 2010, 6:04 PM
I'm assuming you want the colour changable via the db so I'd right a function that retireived the values and used Ext.util.CSS to MAKE the classes you want. Then your override can call the classes as you already specified.

bkraut
29 Jan 2010, 2:01 AM
Following did the trick:



var gridView = new Ext.grid.GridView({
getRowClass : function (row, index) {
var data = row.data;
var leadStatusNameSymbol = data.leadStatus.replace(' ', '');
var cssDef = '.' + leadStatusNameSymbol + ' { background: #' + data.leadStatusColor + '; }';
Ext.util.CSS.createStyleSheet(cssDef);
return leadStatusNameSymbol;
}
});


Thanks for pointing me out.