File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
http://aspose.com/file-tools
The moose likes HTML, CSS and JavaScript and the fly likes Hiding child element - IE works, but Mozilla no Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Hiding child element - IE works, but Mozilla no" Watch "Hiding child element - IE works, but Mozilla no" New topic
Author

Hiding child element - IE works, but Mozilla no

Mir Ricco
Greenhorn

Joined: Jun 19, 2003
Posts: 15
Hello,
I'm trying to do expandable javascript tree view, but it does not work with mozilla and netscape. Can someone help me which way do i have to modify the javascript code ?
Here is my example:
MS IExplorer has no problems expanding and collapsing the tree after clicking on the text SUB, but what about Mozilla or Netscapoe ?
My problem is, i can't use getElementById, because in my document are more tags with the same id. I have to lookup in <li> childs, there can be only one tag with the id.
TREEVIEW.HTML:
<html>
<head>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
function clickHandler() {
var targetId, srcElement, targetElement;
//this one may be IE specific, but i think something else is also
srcElement = window.event.srcElement;
if (srcElement.className == "Outline") {
targetId = srcElement.id + "d";
childs = srcElement.childNodes;
for(i=0; i<childs.length; i++) {
if (childs[i].id == targetId) {targetElement = childs[i];}
}
if (targetElement.style.display == "none") {
targetElement.style.display = "";
} else {
targetElement.style.display = "none";
}
}
}
document.onklick = clickHandler; //onklick= o n c l i c k
</SCRIPT>
<ul id="rootd">
<li class="Outline" id="sub1">SUB1
<ul id="sub1d">
<li>nod1
<li>nod2
<li class="Outline" id="sub2">SUB2
<ul id="sub2d">
<li>nod4
<li>nod5
<li>nod6
</ul>
<li>nod3
</ul>
<li class="Outline" id="sub2">SUB2
<ul id="sub2d">
<li>nod4
<li>nod5
<li>nod6
</ul>
<li class="Outline" id="sub3">SUB3
<ul id="sub3d">
<li>nod4
<li>nod5
<li>nod6
</ul>
</ul>
</body>
</html>
Regards
Mir
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61662
    
  67

i can't use getElementById, because in my document are more tags with the same id.

Did you consider fixing this? It's no wonder things aren't working correctly. You are creating an invalid document. I think that your time would be better spent fixing the document than trying to patch work-arounds that may or may not work across the various browsers.
hth,
bear


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Mir Ricco
Greenhorn

Joined: Jun 19, 2003
Posts: 15
Yes it's one possibility, i can set unique id, which can be very long when the tree is big, because it should reflect the element path from the root.
But i wanted to know if the other aproach is also possible.
Isn't it possible to go through child nodes in every browser ?
Regards
Mir
 
It is sorta covered in the JavaRanch Style Guide.
 
subject: Hiding child element - IE works, but Mozilla no