Detail

ExtJS - styling grid rows

he styling for a row can depend on the data for that row which is represented in by a record in the grid's store. To achieve that goal, we can add a CSS class to the row (or better said the <tr> that represents that row) using the config option getRowClass:

 

Ext.create('Ext.grid.Panel', { 

 

    ..

    viewConfig: { 

        getRowClass: function(record) { 

            return record.get('gender') == 'm' ? 'male-row' : 'female-row'; 

        } 

    } 

});

The correspondig CSS classes would then look like:

 

.male-row .x-grid-cell { 

 

    background-color: red; 

 

.female-row .x-grid-cell { 

    background-color: green; 

}

You can find a JSFiddle to test  here .

Cookie-Einstellungen

Auch wir verwenden Cookies. Durch die weitere Nutzung unserer Website sind Sie mit der Verwendung dieser Cookies einverstanden. Darüber hinaus sind auf dieser Website Dienste anderer Dienstleister eingebunden. Dazu werden ebenfalls Cookies gesetzt, die sie jeder Zeit ändern können. Wir verwenden keine Cookies für Werbezwecke oder Social Media. Weitere Details: Datenschutzerklärung und Impressum

Details anzeigen

Name Cookie Dauer Zweck
eye-cookie Consent Cookie 10 Jahre Dieses Cookie speichert Informationen zum Verwalten Ihrer Cookie-Einstellungen für diese Webseite
Details anzeigen

Wir verwenden Dienste von Drittanbietern.

Name Cookie Dauer Zweck
Goolge Maps google-maps Google Maps Cookie
Google Recaptcha google-recaptcha
Google Analytics GA