ASP.NET樹形圖用于顯示按照樹形結構進行組織的數據，其用途比較廣泛，如計算機中的文件系統(Windows中的資源管理器)、企業或公司的組成結構等。我們知道在Windows下VB、PB、Delphi等工具提供了一個功能很強的樹型控件TreeView，利用Treeview控件可以方便地開發樹形圖。然而在網頁上實現樹形圖就不那么容易了，現在在ASP.NET中利用微軟提供的Internet Explorer WebControls它使得網頁上的樹形圖開發與在Windows下一樣的方便，一樣的功能強大，甚至更靈活。

本文介紹用Internet Explorer WebControls開發ASP.NET樹形圖的方法，由于樹形圖結構較復雜，使用起來常不知如何下手。筆者結合最近剛為公司用ASP.NET編寫的應用程序管理器這一具體實例，詳細闡述在ASP.NET下如何將Internet Explorer WebControls的使用與數據庫聯系起來，實現數據分任意多層顯示，方便地進行增加、修改、刪除、移動操作。筆者希望通過對該實例的闡述，達到拋磚引玉的效果，與各位同仁相互交流，共同進步。

一、樹的建立

具體方法是：創建一個數據庫，設計樹圖信息表TREE_INFO，包含NODEID、PARENTID、NODENAME、ADDERSS、ICON字段，其它字段根據實際業務而定，節點名稱NODENAME將在樹型控件的節點上顯示，NODEID字段保存節點的***標識號，PARENTID表示當前節點的父節點號，標識號組成了一個“鏈表”，記錄了樹上節點的結構。設計一個Web窗體其上放置TreeView控件。

Private Sub CreateDataSet()’建立數據集  
Dim myConn As New SqlConnection()  
Dim myCmd As New SqlCommand("select NODEID,NODENAME,PARENTID,
ADDRESS,ICON from Tree_info", myConn)  
Dim myDataAdapter As New SqlDataAdapter()  
myConn.ConnectionString = Application("connectstring")  
myCmd.CommandText = "" 
myCmd.Connection = myConn 
myDataAdapter.SelectCommand = myCmd 
myDataAdapter.Fill(ds, "tree")  
End Sub  

建樹的基本思路是：從根節點開始遞歸調用顯示子樹

Private Sub Page_Load(ByVal sender As System.Object, 
ByVal e As System.EventArgs) Handles MyBase.Load  
CreateDataSet()  
intiTree(TreeView1.Nodes, 0)  
End Sub  
Private Sub intiTree(ByRef Nds As TreeNodeCollection, 
ByVal parentId As Integer)  
Dim dv As New DataView()  
Dim drv As DataRowView  
Dim tmpNd As TreeNode  
Dim intId As Integer  
dv.Table = ds.Tables("tree")  
dv.RowFilter = "PARENTID=’" & parentId & "’"  
For Each drv In dv  
tmpNd = New TreeNode()  
strId = drv("NODE_ID")  
tmpNd.ID = strId 
tmpNd.Text = drv("NODE_NAME ")  
tmpNd.ImageUrl = drv("ICON").ToString  
Nds.Add(tmpNd)  
intiTree(Nds(Nds.Count - 1).Nodes, intId)  
Next  
End Sub 

二、增加、刪除樹節點

單純在Treeview 上增加、刪除、修改節點只需用Nodes屬性的Add、 Remove、等方法即可，值得注意的地方是VS.NET中Treeview的Nodes集合與VS6.0中的區別，VS6.0中的是一個大的集合，而 VS.NET中的是分層的每個Node下都有Nodes屬性。增加、刪除、修改樹節點時與VS6.0相比有很大差別，特別是刪除時。
Private Sub ButAdd_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ButAdd.Click’在選定的節點下添加子節點

Dim tmpNd As New TreeNode(), NdSel As TreeNode  
tmpNd.ID = GetNewId()  
NdSel = TreeView1.GetNodeFromIndex(TreeView1.SelectedNodeIndex)’選中的節點  
tmpNd.Text = "新節點" 
NdSel.Nodes.Add(tmpNd)  
Dim myRow As DataRow  
myRow = ds.Tables("tree").NewRow()  
myRow("NODE_NAME") = tmpNd.ID  
myRow("NODE_DESCRIPT") = "新節點" & tmpNd.ID & "_" & NdSel.ID  
myRow("PARENT_NAME") = NdSel.ID  
ds.Tables("tree").Rows.Add(myRow)  
End Sub  
Private Sub ButDele_Click(ByVal sender As Object, ByVal e As System.EventArgs) 
Handles ButDele.Click’刪除選中的節點  
Dim idx As String = TreeView1.SelectedNodeIndex()  
GetNdCol(idx).Remove(TreeView1.GetNodeFromIndex(idx))  
Dim dv As New DataView(), recNo As Integer  
dv.Table = ds.Tables("tree")  
dv.RowFilter= "NODEID=" & NdId  
dv.Delete(0)  
End Sub  
Private Function GetNdCol(ByVal idx As String) As TreeNodeCollection  
‘獲得選中節點的父節點的Nodes集合  
Dim cnt As Integer, i As Integer  
Dim tmpNds As TreeNodeCollection  
Dim idxs() As String  
idxs = Split(idx, ".")  
cnt = UBound(idxs)  
If cnt = 0 Then  
tmpNds = TreeView1.Nodes  
Else  
tmpNds = TreeView1.Nodes(CInt(idxs(0))).Nodes  
For i = 1 To cnt - 1  
tmpNdstmpNds = tmpNds(CInt(idxs(i))).Nodes  
Next  
End If  
Return tmpNds  
End Function 

三、修改、移動樹節點

由于服務器控件不支持鼠標拖動事件，所以不能象Windows程序那樣通過拖動移動節點，這里是通過選擇父節點的方式。移動是通過在原位置刪除，新位置添加實現的，要注意在刪除時先保存節點信息。

Private Sub TreeView1_SelectedIndExchange(ByVal sender As Object, 
ByVal e As Microsoft.Web.UI.WebControls.TreeViewSelectEventArgs) 
Handles TreeView1.SelectedIndexChange  
Dim dv As New DataView()  
dv.Table = ds.Tables("tree")  
Dim tmpNd As TreeNode = TreeNdSel(e.OldNode), tmpNds As TreeNodeCollection  
dv.RowFilter= "NODEID=" & tmpNd.ID  
dv(0)("NODE_DESCRIPT") = Me.TextBox1.Text  
dv(0)("ADDRESS") = Me.TextBox2.Text  
dv(0)("TARGET") = Me.TextBox3.Text  
dv(0)("ICON") = Me.TextBox4.Text  
If dv(0)("PARENTID").ToString <> Me.DropDownList1.SelectedItem.Value Then  
‘移動節點  
dv(0)("PARENT_NAME") = Me.DropDownList1.SelectedItem.Value  
If Me.DropDownList1.SelectedItem.Value = "ROOT" Then  
tmpNds = TreeView1.Nodes  
Else  
tmpNds = FromIdToNode(Me.DropDownList1.SelectedItem.Value, 
TreeView1.Nodes).Nodes’新的父節點的Nodes集合  
End If  
GetNdCol(e.OldNode).Remove(tmpNd)  
tmpNds.Add(tmpNd)  
End If  
tmpNd.Text = Me.TextBox1.Text  
tmpNd.ImageUrl = Me.TextBox4.Text  
tmpNd = TreeView1.GetNodeFromIndex(TreeView1.SelectedNodeIndex)  
dv.RowFilter= "NODEID=" & tmpNd.ID  
Me.TextBox1.Text = dv(0)("NODENAME").ToString  
Me.TextBox2.Text = dv(0)("ADDRESS").ToString  
Me.TextBox3.Text = dv(0)("TARGET").ToString  
Me.TextBox4.Text = dv(0)("ICON").ToString  
End Sub  
Private Function FromIdToNode(ByVal ID As String, 
ByVal Nds As TreeNodeCollection) As TreeNode  
‘由關鍵字查找節點  
Dim i As Integer  
Dim tmpNd As TreeNode, tmpNd1 As TreeNode  
For Each tmpNd In Nds  
If tmpNd.ID = ID Then  
Return tmpNd  
Exit Function  
End If  
tmpNd1 = FromIdToNode(ID, tmpNd.Nodes)  
If Not (tmpNd1 Is Nothing) Then  
Return tmpNd1  
Exit Function  
End If  
Next  
Return Nothing  
End Function 

四、結束語

以上闡述ASP.NET樹形圖，以及如何在對樹節點進行維護（增加、刪除、修改、移動）的同時，修改數據庫數據。由于篇幅所限，筆者在此只對基本思路和流程及關鍵步驟作了介紹，并未列出詳細源代碼，讀者可自行完善。需要詳細源代碼者可與我聯系，本文程序在VS.NET、SQLServer、 Windows 2000、IIS5.0下調試通過。

【編輯推薦】

1. ASP.NET的DataList和Repeater控件
2. 淺析ASP.NET的IIS映射
3. 概述ASP.NET狀態類型
4. 淺談ASP.NET和Web服務器
5. ASP.NET的EnableViewState屬性