View Full Version : getRowClass background in a grid view

3 Jan 2012, 8:21 AM
Im trying to change the background color and font color of rows in a gridview based on a record field im using this:

viewConfig: {
getRowClass: function(record, rowIndex, rowParams, store){
return record.get('rowcolor');

an example value being red and the css rule being:

.red {
background-color: #FF0000 !important;
color: #FFFFFF;

this works in regards to the font color it turns to white. However the background-color rule is ignored. Firebug lists the background-color as transparent.

so i looked at its other classes one being x-grid-row deleteing this class changes the background color to red.

to solve this i tried:

.x-grid-row {

to just completely overule it to red in order to get something other than transparent

despite this the rows are still transparently colored.

what am i missing here?


3 Jan 2012, 8:40 AM
Keep inspecting the DOM... see what classes are placing the background

3 Jan 2012, 11:30 AM
i found out the inner td and div were set to white rather than transparent.

i have applied these rules:

td div {
background-color: transparent;

td {
background-color: transparent !important;
which are working better. ill adapt them to be more specific later