剛好在MSDN論壇中看到有人問了這麼個問題,還蠻有趣的,因此小喵就動手嘗試寫看看。這裡面用到了【TreeView結合資料庫】與【client端呼叫Server端事件的技巧】,另外在【TreeNode】沒有Attributes來設定Client端事件時,加入Client端事件的技巧。
承接上篇
再準備好遞迴建立節點的Function
Function AddNodes(ByRef tNode As TreeNode, ByVal PId As Integer) As String
'******** 遞迴增加樹結構節點 ********
Try
'定義DataRow承接DataTable篩選的結果
Dim rows() As DataRow
'定義篩選的條件
Dim filterExpr As String
filterExpr = "ParentId = " & PId
'資料篩選並把結果傳入Rows
rows = Dt.Select(filterExpr)
'如果篩選結果有資料
If rows.GetUpperBound(0) >= 0 Then
Dim row As DataRow
Dim tmpNodeId As Long
Dim tmpsText As String
Dim tmpsValue As String
Dim tmpsUrl As String
Dim tmpsTarget As String
Dim NewNode As TreeNode
Dim rc As String
'逐筆取出篩選後資料
For Each row In rows
'放入相關變數中
tmpNodeId = row(0)
tmpsText = row(2)
tmpsValue = row(3)
tmpsUrl = row(4)
tmpsTarget = row(5)
'實體化新節點
NewNode = New TreeNode
'設定節點各屬性
'加入Client端Click動作
'**由於TreeNode無法透過Attributes增加Client端事件,所以在這邊用個小技巧
'**在Text裡面將本來的文字用個Span包起來,將MouseDown,MouseUp事件寫在裡面
NewNode.Text = "<span onmousedown='NodeDown(" & tmpNodeId & ")' onmouseup='NodeUp(" & tmpNodeId & ")'>" & tmpsText & "</span>"
NewNode.Value = tmpNodeId
'指定選擇的動作
NewNode.SelectAction = TreeNodeSelectAction.None
'不給超連結與Target
'NewNode.NavigateUrl = tmpsUrl
'NewNode.Target = tmpsTarget
'將節點加入Tree中
tNode.ChildNodes.Add(NewNode)
'呼叫遞回取得子節點
rc = AddNodes(NewNode, tmpNodeId)
Next
End If
'傳回成功訊息
AddNodes = "Success"
Catch ex As Exception
AddNodes = "False"
End Try
End Function
再來,運用上面的,撰寫建立樹的Sub
Sub BuildTree(ByVal myTreeView As TreeView)
'********建立樹狀結構********
'宣告TreeView
Dim Tree1 As TreeView = myTreeView
'取得根目錄節點
Dim RootNode As TreeNode
RootNode = Tree1.Nodes(0)
Dim rc As String
'呼叫建立子節點的函數
rc = AddNodes(RootNode, 0)
End Sub
以上這些都好了,就可以在PageLoad的時候,讓樹建立起來
順便把要用的ClientScript準備好,在PageLoad事件中產生
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dt = GetDataTable()
InitTree(Me.TreeView1)
BuildTree(Me.TreeView1)
'撰寫Client端事件,節點的MouseDown,MouseUp
Dim Script As String = ""
Script += " <script type='text/javascript'>" + vbCrLf
Script += " window.document.select=false; " + vbCrLf
Script += " " + vbCrLf
Script += " " + vbCrLf
Script += " " + vbCrLf
Script += " function NodeDown(NodeId){ " + vbCrLf
Script += " $('#" & Me.txtNodeId.ClientID & "').val(NodeId); " + vbCrLf
Script += " } " + vbCrLf
Script += " function NodeUp(NodeId){ " + vbCrLf
Script += " $('#" & Me.txtParentId.ClientID & "').val(NodeId); " + vbCrLf
Script += " var nid=$('#" & Me.txtNodeId.ClientID & "').val(); " + vbCrLf
Script += " var pid=NodeId; " + vbCrLf
Script += " if(nid!=pid){ " + vbCrLf
Script += " if(window.confirm('您確定要將節點(' + nid + ')搬到節點(' + pid + ')底下嗎??')) " + vbCrLf
Script += " { " + vbCrLf
Script += " //alert('yes' + pid); " + vbCrLf
'借用LinkButton的PostBack來運作
Script += " __doPostBack('" & Me.lbChg.ClientID & "',''); " + vbCrLf
Script += " } " + vbCrLf
Script += " } " + vbCrLf
Script += " " + vbCrLf
Script += " } " + vbCrLf
Script += " </script> " + vbCrLf
Script += " "
Script += " "
Page.ClientScript.RegisterClientScriptBlock(Page.GetType, "myScript", Script)
End Sub
這一篇我大概喵一下.基本上是還不錯.
我不知現在網頁進步到哪裡.我已經好幾年沒玩網頁了.
而用TreeView,就是要在Client 寫VB Script.Java Script或Ajax..不然用傳統的做法.
你只要去移動節點或畫面某部分重算.他就會全部PostBack回Server.整個畫面會閃一下.
現在外面應該很多資源可以找.
我在用ASP.NET 2.0 剛出來時.光研究Client Script 就花了一個多星期.