extjs 4 getRowClass Änderungen nicht sichtbar

Question

Ich habe die folgenden Viewconfig auf das Raster angewendet. Es soll die Zeilenfarbe basierend auf einem Datenwert ändern, aber die Änderungen sind in der Ansicht nicht sichtbar.

.changed_colour { 
    background-color: #FFCC00 
} 

viewConfig: { 
    //Return CSS class to apply to rows depending upon data values 
    getRowClass: function (row, index) { 
     var data = row.data; 
     return data.NoteType === 'PRIVATE' ? 'changed_colour' : ''; 
    } 
} 

merke ich, den Stil für die Zeile in Firebug angewendet:

<tr class="x-grid-row changed_colour"> 

.x-grid-row .x-grid-cell { 
    background-color: white; 
    border-color: #FAFAFA #EDEDED #EDEDED; 
    border-right: 0 solid #EDEDED; 
    border-style: solid; 
    border-width: 1px 0; 
    font: 11px tahoma,arial,verdana,sans-serif; 
} 

Die obige Art Schnipsel zu ExtJS gehört. Kann jemand eine Lösung vorschlagen?

Dank

Answer 1

Dies liegt daran, die Farbe auf der Gitterzelle eingestellt ist. Sie können es in Firebug oder Chrome Developer Tools sehen. Um es zu ändern, ändern Sie Ihren Stil zu:

.changed_colour .x-grid-cell { 
    background-color: #FFCC00 
}