Click to See Complete Forum and Search --> : Table: hidden TR in mozilla


ai3rules
07-28-2005, 09:45 AM
Basically I have <tr>'s that are hidden that are made visible using an external javascript code. This code works perfectly in IE. I haven't really tested on browsers other than IE until now. When I run it in Mozilla, the rows are hidden but when I attempt to expand and then collapse them it does so but not the way it should. The rows appear in the wrong column.

Here is the code I have.

<head>
<script language="javascript">
<!--
function expandSubProducts(which){
var trTags = document.getElementsByTagName("tr")
var aTags = document.getElementsByTagName("a")
//collapse/expand all Products
if(which == "allExpand"){
for(a=0; a < trTags.length; a++){
trTag = trTags[a]
if(trTag.getAttribute("id")== "neutral"){}
else{
trTag.style.display = "block"
//
for(c=0; c < aTags.length; c++){
aTag = aTags[c]
if(aTag.getAttribute("id")){
aTag.innerHTML = "<img src='Images/minus.jpg' border='0' alt='Collapse'>"
}
}
//
}
}
}

if(which == "allCollapse"){
for(b=0; b < trTags.length; b++){
trTag = trTags[b]
if(trTag.getAttribute("id")== "neutral"){}
else{
trTag.style.display = "none"
//
for(d=0; d < aTags.length; d++){
aTag = aTags[d]
if(aTag.getAttribute("id")){
aTag.innerHTML = "<img src='Images/plus.jpg' border='0' alt='Collapse'>"
}
}
//

}
}
}
//collapse/expand individual records
for(i=0; i < trTags.length; i++){
trTag = trTags[i]
visible = trTag.style.display != "none"

if(trTag.getAttribute("id")== "neutral"){}
else
{
if(trTag.getAttribute("id")==which){
if(visible){
trTag.style.display = "none"
document.getElementById(which).innerHTML = "<img src='Images/plus.jpg' border='0' alt='Expand'>"
}
else{
trTag.style.display = "block"
document.getElementById(which).innerHTML = "<img src='Images/minus.jpg' border='0' alt='Collapse'>"

}
}
}
}
}
//-->
</script></head>

<form name="ProductInfo">
<table border="1" style="border-collapse:collapse" width="100%" cellpadding="4" cellspacing="0">
<tr bgcolor="FFFFCC" id="neutral">
<th width="3%"><a href="#" onclick="expandSubProducts('allExpand')"><img src="Images/plus.jpg" border="0" alt="Expand All"></a>&nbsp;<a href="#" onclick="expandSubProducts('allCollapse')"><img src="Images/minus.jpg" border="0" alt="Collapse All"></a></th>

<th width="20%">Vendor</th>
<th width="20%">Release</th>
<th width="20%">OS</th>
<th width="20%">Status</th>
<th width="5%"><img src='Images\notepad.png'></th>
<th width="10%">Date Ordered</th>
</tr>

<tr id="neutral" bgcolor="99CC99"><td align="center" bgcolor="FFFFCC" width="2%">1</td><td colspan="6" onDblClick="expandSubProducts('DB2')"><a href="#" onclick="expandSubProducts('DB2')" id="DB2"><img src="Images/plus.jpg" border="0" alt="Expand"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<b>DB2</b></td></tr>

<tr style="display:none" id="DB2" bgcolor="#b6cad6"><td bgcolor="FFFFCC" width="2%"><a href="InsertModifyDeleteProducts.asp?qryStrng=modify&productID=5&productInfoID=57" class="reg"><!--<img src="Images/modify.gif" border="0" alt="Modify Record">--></a></td>
<td align="center"><a href="InsertModifyDeleteProducts.asp?qryStrng=modify&productID=5&productInfoID=57" class="reg">Computer Associates</a></td><td align="center">1.2.4</td><td align="center">Sun Solaris 2.9 64bit</td><td align="center"><a href="viewNote.asp?productInfoID=57" class="reg">Not Available</a></td><td align="center"><a href="viewNote.asp?productInfoID=57" class="reg"></a></td><td align="center"></td></tr>

<tr style="display:none" id="DB2" bgcolor="white"><td bgcolor="FFFFCC" width="2%"><a href="InsertModifyDeleteProducts.asp?qryStrng=modify&productID=5&productInfoID=44" class="reg"><!--<img src="Images/modify.gif" border="0" alt="Modify Record">--></a></td>
<td align="center"><a href="InsertModifyDeleteProducts.asp?qryStrng=modify&productID=5&productInfoID=44" class="reg">IBM</a></td><td align="center">8.1</td><td align="center">AIX 5L 64bit</td><td align="center"><a href="viewNote.asp?productInfoID=44" class="reg">Downloaded</a></td><td align="center"><a href="viewNote.asp?productInfoID=44" class="reg"><img src='Images\notepad.png' border='0'></a></td><td align="center"></td></tr>

<tr style="display:none" id="DB2" bgcolor="#b6cad6"><td bgcolor="FFFFCC" width="2%"><a href="InsertModifyDeleteProducts.asp?qryStrng=modify&productID=5&productInfoID=54" class="reg"><!--<img src="Images/modify.gif" border="0" alt="Modify Record">--></a></td>
<td align="center"><a href="InsertModifyDeleteProducts.asp?qryStrng=modify&productID=5&productInfoID=54" class="reg">Sybase</a></td><td align="center">10.2.0</td><td align="center">AIX 4.3.3 64bit</td><td align="center"><a href="viewNote.asp?productInfoID=54" class="reg">Downloaded</a></td><td align="center"><a href="viewNote.asp?productInfoID=54" class="reg"></a></td><td align="center">7/21/2005</td></tr>


</table>
</form>

I am guessing there is a basic tweak for mozilla to do this right.
I appreciate any help in advance.