Table of Contents

Screen Shot




Introduction

An extremely simple TreeView control written in ASP. This code show how to create a simple treeview class using ASP and Cascading Stylesheets. Excellent for programmers who want to learn how to create simple ASP controls.



Adding the TreeNodes Manually

To create a sample treeview include your treeview class file (clsTreeView.asp) and try the code below


<!--#include file="clsTreeView.asp"-->
<%
'declare your treeview object
Dim objTV

'create an instance of your treeview
Set objTV = New TreeView

'add 2 nodes to your treeview
objTV.AddNode("Node1")
objTV.AddNode("Node2")

'add 2 leaves to your first node
objTV.Nodes(0).Add(objTV.CreateNode("Node 1:1","page1.htm","Tool tip text"))
objTV.Nodes(0).Add(objTV.CreateNode("Node 1:2","page2.htm","Tool tip text"))

'add a childnode node to your second node
objTV.Nodes(1).Add(objTV.CreateSimpleNode("Node 2:1"))

'add leaves to your second node's first child
With objTV.Nodes(1).ChildNodes(0)
    .Add(objTV.CreateNode("YaHoo","http://yahoo.com","YaHoo (2:1:1)"))
    .Add(objTV.CreateNode("DataML","http://dataml.net","DataML (2:1:2)"))

    'add an different image to the yahoo link
    .ChildNodes(0).ImageUrl="http://www.yahoo.com/favicon.ico"
End With

'display your treeview
objTV.Display

'clear memory
Set objTV = Nothing

%>


Using Multiple TreeViews

If you want to use more than one treeview on the same page, add an ID value to each treeview as follows:

'declare objects
Dim objTV1, objTV2

'create instances of your treeviews
Set objTV1 = New TreeView
Set objTV2 = New TreeView

'set treeview ID's
objTV1.ID = "TV1"
objTV2.ID = "TV2"


Loading from a Database

If you want to load your treeview from a database table, make sure you have a table in your database with the following structure:



Where the ParentID field is the first ancestor of the tree node. A ParentID of zero indicates a Root Node in the treeview. The URL and ToolTip fields can be left empty for non-leaf nodes. You can then load your treeview by calling the LoadFromDB method as follows:

     TreeView.LoadFromDB(Connection String,Menu Table Name)

The sample code below shows how to load the treeview from a database table called Menu

<!--#include file="clsTreeView.asp"-->
<%

'declare objects
Dim objTV, strConn

'set your connection string
strConn = "DRIVER={Microsoft Access Driver (*.mdb)};" _
    & "DBQ=" & Server.MapPath("site.mdb")

'create instances of your treeview
Set objTV = New TreeView

'load the treeview from the 'Menu' database table
Call objTV.LoadFromDB(strConn,"Menu")

'display your treeview
objTV.Display

'clear memory
Set objTV = Nothing

%>
You can always modify the database and the TreeView Class (clsTreeView.asp file) to meet your needs such as adding an ImageURL field or even optimizing the LoadFromDB procedure.


Displaying a windows directory/folder

If you want to display the contents of a folder like windows explorer, all you have to do is call the DisplayFolderContents with the folder path as shown below:

<!--#include file="clsTreeView.asp"-->
<%

'declare objects
Dim objTV

'create an instance of your treeview
Set objTV = New TreeView
Call objTV.DisplayFolderContents("C:\InetPub\wwwroot")

'clear memory
Set objTV = Nothing


%>
    

You can always modify this procedure to ignore certain folders and files you don't want displayed.