I really would know how to delete the totality of the "tree" by clicking
on a button in order to replace the current "tree" by an other one in the
same document (coz I want to display different "trees" in the same layer).
I know the "outerHTML" method can be used, but I can't manage to set it in
the code.
Could you please tell me how to place the different "trees" in other file
and call them with a common function.
I know that I ask a lot, but you'll be really nice if you HELP ME!
Gérald from Toulouse [(France) > Excuse my English]
contact : geraldp@w...
THE code...
<HTML>
<HEAD>
<STYLE>
SPAN {cursor: hand ; font-size: 8pt;
font-family:Verdana,Arial,Helvetica;}
.bright {color: red ; font-size: 8pt;
font-family:Verdana,Arial,Helvetica;}
.dark {color: black ; font-size: 8pt;
font-family:Verdana,Arial,Helvetica;}
</STYLE>
<SCRIPT LANGUAGE="JScript">
var curLevel = 0;
var prevElement = null;
var prevLevel;
var prevID;
var builtHTML = "";
function MakeTree() {
var coll = document.all;
var level;
var id;
var tagBegin;
for (i=document.body.sourceIndex+1; i<coll.length; i++) {
switch (coll[i].tagName.substring(0,3)) {
case "LVL":
level = parseInt(coll[i].tagName.charAt(3));
break;
default:
level = -1;
}
if (level!=-1) {
id = i;
addElem(coll[i], level, id);
}
}
addElem(prevElement,0, prevID);
divWrap();
// document.all.Debug.outerText = MyTree.innerHTML;
}
function addElem(el, level, id) {
if (prevElement == null)
{
prevElement = el;
prevLevel = level;
prevID = id;
return;
}
var s = " ";
for (var j=0; j<prevLevel; j++)
s = s + s;
if (level > curLevel)
{
builtHTML += "<SPAN STYLE='cursor:default' CLASS='dark' IURL='"
+ prevElement.getAttribute('IURL')
+ "'>"
+ s
+ "<IMG STYLE='cursor:hand' SRC='expand.gif' ID='OUT"
+ prevID.toString()
+ "' CLASS='collapsible' > "
+ prevElement.getAttribute('ITEXT')
+ "<BR></SPAN>"
+ "<DIV ID='OUT"
+ prevID.toString()
+ "D' STYLE='display:none' >";
curLevel = level;
}
else
{
builtHTML += "<SPAN STYLE='cursor:hand' CLASS='dark' IURL='"
+ prevElement.getAttribute('IURL')
+ "' FLASHER>"
+ s
+ "<IMG STYLE='cursor:default' SRC='leaf.gif'> "
+ prevElement.getAttribute('ITEXT')
+ "<BR></SPAN>";
if (level < curLevel)
{
for (var tplev = level; tplev < curLevel; tplev++)
builtHTML += "</DIV>";
curLevel = level;
}
}
prevElement = el;
prevLevel = level;
prevID = id;
}
function divWrap() {
while (curLevel > 0)
{
builtHTML += "</DIV>";
curLevel--;
}
document.all.MyTree.innerHTML=builtHTML;
}
function clickHandler() {
var colId, colElem ;
var tpURL;
gifElem = window.event.srcElement;
if (gifElem.className == "collapsible") {
colId = gifElem.id + "D";
colElem = document.all(colId);
if (colElem.style.display == "none") {
colElem.style.display = "" ;
gifElem.src = "fixed.gif" ;
} else {
colElem.style.display = "none" ;
gifElem.src = "expand.gif" ;
}
}
if (gifElem.className == "bright")
{
window.open(gifElem.getAttribute("IURL"),"","top=100,left=400,height=400,width=200,menubars=no,toolbars=no,location=no,scrollbars=no
,resizable=yes");
}
}
function MakeBright() {
el = event.srcElement ;
if (el.getAttribute("FLASHER") != null) {
el.className = "bright" ;
}
}
function MakeDark() {
el = event.srcElement ;
if (el.getAttribute("FLASHER") != null) {
el.className = "dark";
}
}
</SCRIPT>
</HEAD>
<BODY ONLOAD="MakeTree()">
<LVL0 ITEXT="Parent1"></LVL0>
<LVL1 ITEXT="Item1" IURL="" ITARGET=""></LVL1>
<LVL1 ITEXT="Item2" IURL="" ITARGET=""></LVL1>
<LVL1 ITEXT="Item3" IURL="" ITARGET=""></LVL1>
<LVL0 ITEXT="Parent2"></LVL0>
<LVL1 ITEXT="Item1" IURL="" ITARGET=""></LVL1>
<LVL1 ITEXT="Item2" IURL="" ITARGET=""></LVL1>
<LVL0 ITEXT="Parent2"></LVL0>
<LVL1 ITEXT="Item1" IURL="" ITARGET=""></LVL1>
<LVL1 ITEXT="Item2" IURL="" ITARGET=""></LVL1>
<LVL1 ITEXT="Item3" IURL="" ITARGET=""></LVL1>
<LVL1 ITEXT="Item4" IURL="" ITARGET=""></LVL1>
<DIV ID=MyTree>
</DIV>
<DIV ID=Debug>
</DIV>
</TD></TR>
</TABLE>
<SCRIPT LANUGAGE="JScript">
document.onclick = clickHandler;
document.onmouseover = MakeBright;
document.onmouseout = MakeDark;
</SCRIPT>
</BODY>
</HTML>