From: RobG on
On Dec 4, 10:12 am, Stefan Mueller <seekw...(a)yahoo.com> wrote:
> Many thanks for your help. It works great!
>
>   for (var i=0; ilen=row_arraylength; i<ilen; i++) {
>     var row = row_array[i][1];
>
>     if (i % 2) {
>       row.className = "tableentry_odd";
>     }
>     else {
>       row.className = "tableentry_even";
>     }
>     var_table.appendChild(row_array[i][1]);
>   }
>
> Because each row is initial define with
>   <tr class = "tableentry_odd"
>   onMouseover = "className = 'tableentry_active'"
>   onMouseout = "className = 'tableentry_odd'">
> I also need to set 'onMouseover' and 'onMouseout'.
>
> Does someone know if I can also set 'onMouseover' and 'onMouseout'
> within the for loop (same way as row.className = "tableentry_odd";)?

Yes. You can just add the extra class, then remove it - there is no
need to add and remove the odd and even classes at the same time
provided the new active class name is added after the others.

Search the archives, there are plenty of add and remove class
functions.


--
Rob


From: JR on
On Dec 3, 4:11 am, David Mark <dmark.cins...(a)gmail.com> wrote:
> On Dec 2, 6:22 pm, JR <groups_j...(a)yahoo.com.br> wrote:
>
>
>
> > On Dec 1, 10:53 pm, Stefan Mueller <seekw...(a)yahoo.com> wrote:
>
> > > I'm using the following code to sort a html table:
> > >     ...
> > >     var_table = this.sorttable_tbody;
>
> > >     for (rowcounter = 0; rowcounter < row_array.length; rowcounter++)
> > > {
> > >       var_table.appendChild(row_array[rowcounter][1]);
> > >     }
>
> > > The 'appendChild' method moves each row of my existing html table in a
> > > sorted manner to the end of the html table. That really works great an
> > > very fast. However, the rows in my html table look like
> > >   <tr class = "tableentry_odd">...
> > >   <tr class = "tableentry_even">...
> > > I use this so that each second row has a different background color.
> > > But after I've sorted the html table the background colors get mixed
> > > up.
> > > My intention is now to read the content of 'row_array[rowcounter][1]'
> > > and to adjust '<tr class = "tableentry_...">...' so that each second
> > > row has a different background color again. However, I've no idea how
> > > to read and modify the content of 'row_array[rowcounter][1]'.
>
> > > If I do 'alert(row_array[rowcounter][1]);' the output always shows
> > > '[object]'.
>
> > > Does someone know how to read the content of 'row_array[rowcounter]
> > > [1]' and if my intention to modify the content of 'row_array
> > > [rowcounter][1]' makes sense so that each second row has a different
> > > background color even after the html table got sorted?
>
> > Check this out:http://www.jrfaq.com.br/sortable.htm
>
> Okay.
>
> getInnerText : function (el) {
> /* Code is optimized for IE7 because of its slower performance.
>          innerText -> innerText is an IE 6 and 7 proprietary spec;
>          textContent -> DOM Level 3 - FF, Safari, etc., except IE
>          innerHTML -> at last we'll try the sluggish innerHTML. */
>                 var re = /^\s+|\s+$/g;
>                 if (typeof el.innerText !== 'undefined') { return
> el.innerText.replace(re, ''); }
>                 if (typeof el.textContent !== 'undefined') { return
> el.textContent.replace(re, ''); }
>                 if (typeof el.innerHTML === 'string') {
>                         return el.innerHTML.replace(/^\s+<[^<>]+>|\s+$/g, '');
>                 }
>         },
>
> Now, what possessed you to re-invent this particular wheel?  I see you
> added trimming.  Lose that last fork as it isn't close.  Loop through
> the text nodes instead.  Search the archive or see the example in My
> Library for more efficient one-off examples.

The getInnerText() method mentioned above is not a generic function.
Instead, it's tailored specifically for sorting a table containing
simple data, like cells of a data sheet.

> // Look for tables which className contains 'sortable' and prepare
> them for sorting.
> var isMSIE = /*@cc_on!@*/false; // Dean Edwards' browser sniff.
>
> You know you have gone down a wrong path when you start pasting in his
> BS.  ;)  This ain't 2005 you know?

IE sniffing is only necessary because of the next lines.

> this.arrows = { // Adapted by JR from Stuart Langridge's idea.
> up : (isMSIE ? '&nbsp<font face="webdings">5</font>' :
> '&nbsp;&#x25B4;'),
> down : (isMSIE ? '&nbsp<font face="webdings">6</font>' :
> '&nbsp;&#x25BE;')
>                 };
>
> Stuart Langridge had a very bad idea.  Why copy it?

What's your problem with the brits?

> Don't have time to look at the rest.  It would be disallowed anyway
> due to the above.  Did seem to work in FF3 anyway.  But I am hesitant
> to endorse it on the basis of this observation.  ;)

That code works in FF3, IE7/8, Safari3 and Opera9.64 as expected.

Cheers,
JR
From: David Mark on
On Dec 4, 5:30 pm, JR <groups_j...(a)yahoo.com.br> wrote:
> On Dec 3, 4:11 am, David Mark <dmark.cins...(a)gmail.com> wrote:
>
>
>
> > On Dec 2, 6:22 pm, JR <groups_j...(a)yahoo.com.br> wrote:
>
> > > On Dec 1, 10:53 pm, Stefan Mueller <seekw...(a)yahoo.com> wrote:
>
> > > > I'm using the following code to sort a html table:
> > > >     ...
> > > >     var_table = this.sorttable_tbody;
>
> > > >     for (rowcounter = 0; rowcounter < row_array.length; rowcounter++)
> > > > {
> > > >       var_table.appendChild(row_array[rowcounter][1]);
> > > >     }
>
> > > > The 'appendChild' method moves each row of my existing html table in a
> > > > sorted manner to the end of the html table. That really works great an
> > > > very fast. However, the rows in my html table look like
> > > >   <tr class = "tableentry_odd">...
> > > >   <tr class = "tableentry_even">...
> > > > I use this so that each second row has a different background color..
> > > > But after I've sorted the html table the background colors get mixed
> > > > up.
> > > > My intention is now to read the content of 'row_array[rowcounter][1]'
> > > > and to adjust '<tr class = "tableentry_...">...' so that each second
> > > > row has a different background color again. However, I've no idea how
> > > > to read and modify the content of 'row_array[rowcounter][1]'.
>
> > > > If I do 'alert(row_array[rowcounter][1]);' the output always shows
> > > > '[object]'.
>
> > > > Does someone know how to read the content of 'row_array[rowcounter]
> > > > [1]' and if my intention to modify the content of 'row_array
> > > > [rowcounter][1]' makes sense so that each second row has a different
> > > > background color even after the html table got sorted?
>
> > > Check this out:http://www.jrfaq.com.br/sortable.htm
>
> > Okay.
>
> > getInnerText : function (el) {
> > /* Code is optimized for IE7 because of its slower performance.
> >          innerText -> innerText is an IE 6 and 7 proprietary spec;
> >          textContent -> DOM Level 3 - FF, Safari, etc., except IE
> >          innerHTML -> at last we'll try the sluggish innerHTML. */
> >                 var re = /^\s+|\s+$/g;
> >                 if (typeof el.innerText !== 'undefined') { return
> > el.innerText.replace(re, ''); }
> >                 if (typeof el.textContent !== 'undefined') { return
> > el.textContent.replace(re, ''); }
> >                 if (typeof el.innerHTML === 'string') {
> >                         return el.innerHTML.replace(/^\s+<[^<>]+>|\s+$/g, '');
> >                 }
> >         },
>
> > Now, what possessed you to re-invent this particular wheel?  I see you
> > added trimming.  Lose that last fork as it isn't close.  Loop through
> > the text nodes instead.  Search the archive or see the example in My
> > Library for more efficient one-off examples.
>
> The getInnerText() method mentioned above is not a generic function.
> Instead, it's tailored specifically for sorting a table containing
> simple data, like cells of a data sheet.

It certainly is not.

>
> > // Look for tables which className contains 'sortable' and prepare
> > them for sorting.
> > var isMSIE = /*@cc_on!@*/false; // Dean Edwards' browser sniff.
>
> > You know you have gone down a wrong path when you start pasting in his
> > BS.  ;)  This ain't 2005 you know?
>
> IE sniffing is only necessary because of the next lines.

IE sniffing is not necessary.

>
> > this.arrows = { // Adapted by JR from Stuart Langridge's idea.
> > up : (isMSIE ? '&nbsp<font face="webdings">5</font>' :
> > '&nbsp;&#x25B4;'),
> > down : (isMSIE ? '&nbsp<font face="webdings">6</font>' :
> > '&nbsp;&#x25BE;')
> >                 };
>
> > Stuart Langridge had a very bad idea.  Why copy it?
>
> What's your problem with the brits?

I don't have a problem with "the brits". That code is complete BS.
Do you think MSHTML implies that the Webdings font is available? I
assure you it doesn't and that using that font in a Web page is the
sort of thing you would have seen in 1990's "best viewed in IE" page.

>
> > Don't have time to look at the rest.  It would be disallowed anyway
> > due to the above.  Did seem to work in FF3 anyway.  But I am hesitant
> > to endorse it on the basis of this observation.  ;)
>
> That code works in FF3, IE7/8, Safari3 and Opera9.64 as expected.
>

So?

From: Dr J R Stockton on
In comp.lang.javascript message <20d385d6-fb91-4d9e-a869-dd630d641de2(a)b2
g2000yqi.googlegroups.com>, Thu, 3 Dec 2009 16:12:09, Stefan Mueller
<seekware(a)yahoo.com> posted:
>
> if (i % 2) {
> row.className = "tableentry_odd";
> }
> else {
> row.className = "tableentry_even";
> }

More elegantly written as

row.className = i%2 ? "tableentry_odd" : "tableentry_even"

or even

row.className = "tableentry_" + (i%2 ? "odd" : "even")

Unless paid by the yard, it is well to minimise the amount of duplicated
code.


--
(c) John Stockton, nr London, UK. ?@merlyn.demon.co.uk Turnpike v6.05 MIME.
Web <URL:http://www.merlyn.demon.co.uk/> - FAQqish topics, acronyms & links;
Astro stuff via astron-1.htm, gravity0.htm ; quotings.htm, pascal.htm, etc.
No Encoding. Quotes before replies. Snip well. Write clearly. Don't Mail News.
From: Stefan Mueller on
Sam, your solution works great.

row.state = row.className;

...

<tr class="tableentry_odd"
onmouseover="this.className='tableentry_active';"
onmouseout="this.className=this.state">

Many thanks!

May I ask why you put a ';' to the second last position of the
following line?
onmouseover="this.className='tableentry_active';"

Is it really necessary and if yes why didn't you also put a ';' at the
third last position of the following line?
onmouseout="this.className=this.state;">