Introduction
Tree View builds tree browsers for your web pages. It was inspired by D. D. de Kerf who created Easy DHTML treeview.
However, it was not practical for creating complex dynamic trees. So I took his ideas and wrote a JavaScript that uses DOM to build the hierarchical document he created with static HTML.
To build the tree is very straightforward:
- You include the treeview.js file into your HTML.
<script language="javascript" src="scripts/tree_view.js"></script>
- Hook into the event that calls a method when the page is loaded:
<body onLoad="CreateProjectExplorer()">
- Create a function that builds the tree:
function CreateProjectExplorer()
{
Initialise();
d = CreateTreeItem( rootCell, "img/project.gif",
"img/project.gif", "Point of Sale terminal",
null, null );
d2 = CreateTreeItem( d, "img/folder_closed.gif",
"img/folder_open.gif", "Actors", null, null );
}
That's it! You are up and running with a tree browser.
The function signature is:
function CreateTreeItem( parent, img1FileName,
img2FileName, nodeName, url, target )
Thanks to D. D. de Kerf for the inspiration!
Note: This script is supplied "as is" without any form of warranty. Rewritten Software shall not be liable for any loss or damage to person or property as a result of using this script. Use this script at your own risk!
You are licensed to use this script free of charge for commercial or non-commercial use providing you do not remove the copyright notice or disclaimer from the comment section in the script.
Have fun!