"HikksNotAtHome" <hi************@aol.com> wrote in message
news:20***************************@mb-m11.aol.com...
In article <3f***********************@news.optusnet.com.au> , RIck Measham
<ri***@spam-site.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.