PDA

View Full Version : Grid row coloring



Ronits
5 Mar 2013, 9:05 PM
Hi,
Need to change grid alternate row coloring, every third alternate row. Any help would be appreciated.
Please find the screenshot.

42211

saJoshua
6 Mar 2013, 5:53 AM
Look at getRowClass (http://docs.sencha.com/ext-js/4-1/#!/api/Ext.view.Table-method-getRowClass) and use with a combination of something like


return index % 6 < 3 ? 'color1' : 'color2');

then just add appropriate CSS styling for color1 / color2 CSS classes.

Ronits
6 Mar 2013, 8:46 AM
Got it. Thanks.

return (Math.floor(index / 3.0) % 2 == 0) ? 'rowClass1' : 'rowClass2';

gokulpotluri
6 Mar 2013, 9:58 AM
if you want grid colors for alternate rows then this will help you please check this link

http://skirtlesden.com/articles/styling-extjs-grid-cells

.extra-alt .x-grid-row .x-grid-cell {
background-color: #fff;
color: #000;
}

.extra-alt .x-grid-row-alt .x-grid-cell {
background-color: #000;
color: #fff;
}

var grid = Ext.create('Ext.grid.Panel', {
...........
cls:'extra-alt',
...........
});

saJoshua
6 Mar 2013, 11:05 PM
the thing to do is mark a certain post within that thread as being the best answer

http://www.sencha.com/forum/showthread.php?153201-Answered-Unanswered

voting up some helpful other answers is also nice.

Ronits
7 Mar 2013, 9:29 AM
Got it. Thanks again.. :)