A
annoyingmouse
Hi there,
Okay, I'm guessing I'll slap myself in the forehead once I grok it
properly but I'm trying to hide and show table rows without using an
external library.
Each of the rows has a class attribute. There is one of "typeOneRow"
followed by 0 to an arbitrary number of "typeTwoRow" before the next
"typeOneRow" and so one for an arbitrary number of rows. Like:
<tr class="typeOneRow"><td>Some Text <span onclick=""></span></
td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeOneRow"><td>More Text <span onclick=""></span></
td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeOneRow"><td>Something <span onclick=""></span></
td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeOneRow"><td>Wibble <span onclick=""></span></td><td></
td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
Within the "typeOneRow" there are two cells, within the first there is
some text and a span which, when clicked, calls a function which gets
the text content of the cell (var searchedForContent =
span.parentNode.firstChild.nodeValue. The function then iterates
through the rows of the table until it finds the row with the cell
which has content the same as searchedForContent.
Now what I want to do next is alter the style attribute of each
subsequent row (the "typeTwoRow" rows) until the next "typeOneRow" is
found. I figure it's possible it's just that I'm getting lost within
loops.
As an aside, is there a better way of getting the class name of an
element other than using .getAttribute("class")?
Cheers,
Dom
Okay, I'm guessing I'll slap myself in the forehead once I grok it
properly but I'm trying to hide and show table rows without using an
external library.
Each of the rows has a class attribute. There is one of "typeOneRow"
followed by 0 to an arbitrary number of "typeTwoRow" before the next
"typeOneRow" and so one for an arbitrary number of rows. Like:
<tr class="typeOneRow"><td>Some Text <span onclick=""></span></
td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeOneRow"><td>More Text <span onclick=""></span></
td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeOneRow"><td>Something <span onclick=""></span></
td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
<tr class="typeOneRow"><td>Wibble <span onclick=""></span></td><td></
td></tr>
<tr class="typeTwoRow" style="display:none;"><td></td><td></td></tr>
Within the "typeOneRow" there are two cells, within the first there is
some text and a span which, when clicked, calls a function which gets
the text content of the cell (var searchedForContent =
span.parentNode.firstChild.nodeValue. The function then iterates
through the rows of the table until it finds the row with the cell
which has content the same as searchedForContent.
Now what I want to do next is alter the style attribute of each
subsequent row (the "typeTwoRow" rows) until the next "typeOneRow" is
found. I figure it's possible it's just that I'm getting lost within
loops.
As an aside, is there a better way of getting the class name of an
element other than using .getAttribute("class")?
Cheers,
Dom