:: Forum >> Version 1 >>

Alternate background color of each row

More information on this topic is available in the documentation section: /active.howto.style.rows/alternate-background-colors.html.

It possible of alternate each row backgroung color?
Wednesday, November 12, 2003
I will try to add this to the next release
Alex (ActiveWidgets)
Wednesday, November 12, 2003
Hi

I don't know if this is the right way to do this, but here is how I alternated the row colors.

function myColor(){
var value = this.getProperty("item/index");
return (value & 1) ? "#ddd" : "white";
}

obj.getTemplate("row", 0).setStyle("background-color", myColor);

John M
Thursday, November 27, 2003
Yes, John - its very close, except that you need another property. item/index refers to the position in the data source and not on the display, so the colors may go out of order as soon as you sort the data. We need something like item/order instead - its not there yet, but I'm planning to add it.

rgds,
Alex (ActiveWidgets)
Alex (ActiveWidgets)
Thursday, November 27, 2003
Thanks for pointing that out, I hadn't tried sorting it after I made that change. When will it be available?
John M
Thursday, November 27, 2003
Has this feature been added yet? I am very interested in using this if this feature is there.
Keith
Tuesday, May 18, 2004
I found the code:
var alternate = function(){
return this.getProperty("row/order") % 2 ? "#90EE90" : "white";
}

var row = new Active.Templates.Row;
row.setStyle("background", alternate);
obj.setTemplate("row", row);
Keith
Wednesday, May 19, 2004
I like these examples and they work great. Here's the deal. I've got a designer on my butt to show the grid with alternating row colors BUT not show the alternating colors on the last column that is really not a column.

Know what I mean?

The last column that always appears, but is not actually a column. We gotta make that a straight color. I can't seem to find any references about how to control that portion of the grid.

Any Ideas?
Cameron
Friday, April 8, 2005
You have something wrong in the number of columns you have defined. If you declare the correct number of columns then there are no 'extra' columns. It sounds like you have the classic 'off by one' problem that besets most developers. None of my grids have extra columns. Double check your column count and subtract one from it if you have to in order to get rid of the 'extra' column.
Jim Hunter
Wednesday, May 4, 2005
Hello

I have just implemented your grid into a site, I have found to it very eay to use. I have found it a little hard to customise the look, but at 4am a little understandable.

My question is, is it possible, and if so how? to implement alternate row via a css and id or class.
Leon Chaffey
Friday, June 10, 2005
Cheers Keith, your code works a dream!

DM
DM
Friday, June 10, 2005
Sorry my ingles

It possible modify the row backgroung color depending of the value of one determined column ?

Brasil - Evandro
Saturday, June 11, 2005
Evandro,

yes its possible. Check out the code:
sim eh possivel, coloque o codigo na sua pagina:

function myColor()
{
var value = this.getItemProperty("value");
return value > 0 ? "blue" : "red";
}


for it column you do:
e para cada coluna voce define essa propriedade:

obj.getColumnTemplate(1).setStyle("color", myColor);
Igor Feghali
Friday, June 17, 2005
Thanks Igor, functioned correctly.
Brasil - Evandro
Tuesday, June 28, 2005
how to change special row style? not the whole row template
thanks
mindon
Thursday, September 15, 2005
this not working for me. please help any one?
Jeeva
Wednesday, October 5, 2005



This topic is archived.

Back to /active.howto.style.rows/alternate-background-colors.html

Documentation:

Forum search