HighDots Forums  

Changing the 'display' of multiple items

Javascript JavaScript language (comp.lang.javascript)


Discuss Changing the 'display' of multiple items in the Javascript forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
RIck Measham
 
Posts: n/a

Default Changing the 'display' of multiple items - 09-25-2003 , 06:23 PM






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.

Reply With Quote
  #2  
Old   
HikksNotAtHome
 
Posts: n/a

Default Re: Changing the 'display' of multiple items - 09-25-2003 , 09:53 PM






In article <3f736b24$0$30962$afc38c87 (AT) news (DOT) optusnet.com.au>, RIck Measham
<rickm (AT) spam-site (DOT) net.au> writes:

Quote:
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:
snip
4. Doing something else that I haven't thought of yet.
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


Reply With Quote
  #3  
Old   
Ivo
 
Posts: n/a

Default Re: Changing the 'display' of multiple items - 09-26-2003 , 12:39 PM



"HikksNotAtHome" <hikksnotathome (AT) aol (DOT) com> wrote

Quote:
In article <3f736b24$0$30962$afc38c87 (AT) news (DOT) optusnet.com.au>, RIck Measham
rickm (AT) spam-site (DOT) net.au> writes:

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:
snip
4. Doing something else that I haven't thought of yet.

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.
--
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="specialstatus">...</tr>
<tr id="myTR24" class="specialstatus">...</tr>
<tr id="myTR25" class="ordinarystatus">...</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 createClassNodeArr(e,v){
if(document.getElementsByTagName){
var nodes=document.getElementsByTagName(e);
var max=nodes.length;
for(var i=0;i<max;i++){
var nodeObj=nodes.item(i);
var attrMax=nodeObj.attributes.length;
for(var j=0;j<attrMax;j++){
if(nodeObj.attributes.item(j).nodeName=='class'){
if(nodeObj.attributes.item(j).nodeValue==v){
clssNodeArr[clssNodeArr.length]=nodeObj
}
}
}
}
}
}

onload="createClassNodeArr('tr','specialstatus')"

function
toggledisplay(x){if(document.getElementsByTagName) {x=(x)?'normal':'none';
for(var i = 0;i < clssNodeArr.length;i++) clssNodeArr[i].style.display = x;
}}

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




Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.