Connecting Tech Pros Worldwide Help | Site Map

Hide/Show Table Rows

evanburen@gmail.com
Guest
 
Posts: n/a
#1: Feb 10 '06
I'm using this to hide rows in a table created from ASP. This works
well but I would like to also be able to 'Show' the records again that
there hidden by removeEvents( ). Thanks.

function removeEvents( ) {
var elem = document.getElementById("EventsBody");
for (var i = elem.rows.length-1; i >= 0 ; i--) {
if (elem.rows[i].cells[0].firstChild.checked) {
elem.removeChild(elem.rows[i]);
}
}
}


<% Do While Not rs.EOF %>
<tr>
<td><input type="checkbox"/></td>
</tr>
<%
rs.MoveNext
Loop
%>

<input type="button" value="Hide Checked Events"
onclick="removeEvents();"/>

John
Guest
 
Posts: n/a
#2: Feb 11 '06

re: Hide/Show Table Rows



<evanburen@gmail.com> wrote in message
news:1139612878.007608.160840@z14g2000cwz.googlegr oups.com...[color=blue]
> I'm using this to hide rows in a table created from ASP. This works
> well but I would like to also be able to 'Show' the records again that
> there hidden by removeEvents( ). Thanks.
>
> function removeEvents( ) {
> var elem = document.getElementById("EventsBody");
> for (var i = elem.rows.length-1; i >= 0 ; i--) {
> if (elem.rows[i].cells[0].firstChild.checked) {
> elem.removeChild(elem.rows[i]);
> }
> }
> }[/color]


How about this?

function displayEvents( show) {
var elem = document.getElementById("EventsBody");
for (var i = elem.rows.length-1; i >= 0 ; i--) {
if (elem.rows[i].cells[0].firstChild.checked) {
elem.rows[i].style.display = show ? "inline" : "none";
}
}
}


function hideEvents( ) {
displayEvents(false);
}

function showEvents( ) {
displayEvents(true);
}



Danny
Guest
 
Posts: n/a
#3: Feb 11 '06

re: Hide/Show Table Rows




Do not use .removeChild() method, as it nulls out the node, instead,
just set the .style.display='none' and then back to 'table-row' for
when you want to show them :).

Danny
evanburen@gmail.com
Guest
 
Posts: n/a
#4: Feb 11 '06

re: Hide/Show Table Rows


Perfect! Thanks.

Closed Thread