Changing the 'display' of multiple items

[RIck Measham]

I have a dynamically generated table, filled from a database by a perl
application.

Each row represents a database record and has a 'status' and a unique 'id'.

What I want to do is create buttons to hide all rows with a particular
status. The code to show/hide is relatively easy, but how do I turn them
all off at once?

Several ideas I had:

1. Set the tr's 'id' attribute to the status (eg 'open') and then set that
id to display: none. But that only turns off the first one.

2. Do the same but somehow loop over all elements looking for that id.

3. Set the tr's 'id' attribute to the status plus the data's id (eg
'open.24') then loop over all elements matching the status with a regexp.

4. Doing something else that I haven't thought of yet.

Anyone have any advice and example code?

Cheers!
Rick

--
Obviously the reply-to is a fake. Just change the 'spam-' to 'i' so that the
result sounds like why you go to an optometerist.

[HikksNotAtHome]

Re: Changing the 'display' of multiple items

In article <3f736b24$0$309 62$afc38c87@new s.optusnet.com. au>, RIck Measham
<rickm@spam-site.net.au> writes:
[color=blue]
>What I want to do is create buttons to hide all rows with a particular
>status. The code to show/hide is relatively easy, but how do I turn them
>all off at once?
>
>Several ideas I had:[/color]
<snip>[color=blue]
>4. Doing something else that I haven't thought of yet.[/color]

When each row is given a "status", add its id to an array. When the button is
clicked to hide those rows, loop through the array and hide the id's contained
within.
--
Randy

[Ivo]

Re: Changing the 'display' of multiple items

"HikksNotAtHome " <hikksnotathome @aol.com> wrote in message
news:2003092521 5333.11891.0000 1091@mb-m11.aol.com...[color=blue]
> In article <3f736b24$0$309 62$afc38c87@new s.optusnet.com. au>, RIck Measham
> <rickm@spam-site.net.au> writes:
>[color=green]
> >What I want to do is create buttons to hide all rows with a particular
> >status. The code to show/hide is relatively easy, but how do I turn them
> >all off at once?
> >
> >Several ideas I had:[/color]
> <snip>[color=green]
> >4. Doing something else that I haven't thought of yet.[/color]
>
> When each row is given a "status", add its id to an array. When the button[/color]
is[color=blue]
> clicked to hide those rows, loop through the array and hide the id's[/color]
contained[color=blue]
> within.
> --[/color]

ID's are unique, so giving multiple tr's the same ID confuses the browser. A
class can be shared among different tags, then changing the class style is
all that needs doing. Like so:
<tr id="myTR23" class="specials tatus">...</tr>
<tr id="myTR24" class="specials tatus">...</tr>
<tr id="myTR25" class="ordinary status">...</tr>

Depending on the number of tr's to hide and the overall lebngth of teh
table, it may be better performance wise to initiate an array after load. IF
only one type of status is to be hidden and the status does not change
dynamically, this will delay the page onload, but make it much more fluent
thereafter:

clssNodeArr = new Array();
function createClassNode Arr(e,v){
if(document.get ElementsByTagNa me){
var nodes=document. getElementsByTa gName(e);
var max=nodes.lengt h;
for(var i=0;i<max;i++){
var nodeObj=nodes.i tem(i);
var attrMax=nodeObj .attributes.len gth;
for(var j=0;j<attrMax;j ++){
if(nodeObj.attr ibutes.item(j). nodeName=='clas s'){
if(nodeObj.attr ibutes.item(j). nodeValue==v){
clssNodeArr[clssNodeArr.len gth]=nodeObj
}
}
}
}
}
}

onload="createC lassNodeArr('tr ','specialstatu s')"

function
toggledisplay(x ){if(document.g etElementsByTag Name){x=(x)?'no rmal':'none';
for(var i = 0;i < clssNodeArr.len gth;i++) clssNodeArr[i].style.display = x;
}}

Then try toggledisplay(1 ); and toggledisplay(0 );
or similar.
HTH
Ivo.