Comments on: Easy Zebra Striping with Prototype

By: Johan Känngård

Johan Känngård — Tue, 27 Oct 2009 13:44:41 +0000

If you resort the table, you might want to remove the odd class name first:
Event.observe(window,’load’,function(n){
stripe();
});
function stripe(){
var odds=$$(‘table.stripe tbody tr.odd’);
if(odds) odds.invoke(‘removeClassName’,'odd’);
var evens=$$(‘table.stripe tbody tr:nth-child(odd)’);
if(evens) evens.invoke(‘addClassName’,'odd’);
}

By: wikski

wikski — Wed, 01 Jul 2009 23:28:42 +0000

Zuriel – mate that code is bloody brilliant!

I’ve been looking for something that only utilises every second row as you should only need to apply one class and render the default tr with a style to get the same effect.

legend

By: Zuriel

Zuriel — Tue, 27 Jan 2009 16:25:03 +0000

Below is my favorite syntax. Who says we need jquery?

document.observe(‘dom:loaded’, function(){
$$(‘table.stripe tr:nth-child(odd)’).invoke(“addClassName”, “oddRow”);
});

By: Andruu

Andruu — Fri, 05 Sep 2008 13:05:53 +0000

The equivalent in Prototype is:

document.observe(‘dom:loaded’, function () {});

By: Tanny O'Haley

Tanny O'Haley — Wed, 23 Jul 2008 07:43:05 +0000

@watsoncj, It is a bit of a hack and I have a smaller version for prototype and other frameworks that don't support domready. Unfortunately the only way to support as many browser as I can, I have to use "browser specific Javascript". DOMContentLoaded for Browsers, Part V

By: watsoncj

watsoncj — Tue, 15 Jul 2008 22:01:29 +0000

Thanks Eric,

While it may run a bit after the DOM is ready (especially on larger pages), the Event.observe() does just that. It will invoke the stripe function when the window’s onload event fires.

It doesn’t look like prototype has an equivalent DOMLoaded event. The link below has a very convoluted example of achieving the same thing. But, it’s a bit of a hack with its browser specific Javascript.

http://tanny.ica.com/ica/tko/tkoblog.nsf/dx/domcontentloaded-for-browsers-part-ii

By: Eric Wendelin

Eric Wendelin — Tue, 15 Jul 2008 21:44:32 +0000

I like your method (especially the tr:nth-child(odd) part of $$). Only thing I would suggest is running stripe on DOMReady. Does prototype have a way to attach an event to DOMReady?

Nice example!