View Full Version : How to change row style in Grid.

2 Jul 2012, 8:54 PM
Hello all
I have a grid in which based on some condition I want to change the color of each cell in the table row to red.
I have seen an example in EXT-JS in which it is possible to change the cell content color there by specifying the custom renderer for the column. Though is there any way by which I can apply custom renderer for the whole row instead of column and make the whole row appear in red colour?

2 Jul 2012, 9:49 PM
Hi sameer_ware,

You can use getRowClass() metohd for example-

, viewConfig: {
, getRowClass: function (record, index) {
if (record.data.name == 'sameer') {
return 'valid css class' // this method return class to apply the selected row

for more information see http://docs.sencha.com/ext-js/4-1/#!/api/Ext.view.Table-method-getRowClass

3 Jul 2012, 12:01 AM
grid.getView().addRowCls(store.getAt(x), 'redcolor');

where x would be the index of the record in the store and redcolor would be the css class you want to apply to that record in the grid. or you may put the record directly in place of store.getAt(x).

3 Jul 2012, 12:39 AM
Hello Sword_id
Thank you so much for the reply.
That resolves my issue.