The tree map is used to display data that is tissue according to the tree structure, which is widely used, such as file systems in the computer (resource manager in Windows), corporate or company constituting structures. We know that Tool TreeView with VB, PB, Delphi and other tools under Windows, which can easily develop tree charts using the TreeView control. However, it is not so easy to implement a tree chart on the web page. Now use Microsoft's Internet Explorer WebControls provided in ASP.NET. It makes the tree map on the web and is as convenient to Windows, and even the same function is powerful. More flexible. This article describes how to develop tree graphs with Internet Explorer WebControls. Because the tree diagram structure is more complicated, it is often used to start with it. The author combined with the specific instance of the application manager that has just been prepared to use ASP.NET, explain how to connect Internet Explorer WebControls in ASP.NET to connect to the database, and implement the data division any multi-layer display, conveniently Increase, modify, delete, and move. The author hopes that by the elaboration of this example, the author has achieved the effect of throwing bricks, and communicating with all the colleagues and progress together. Internet Explorer WebControls is not in the standard Server Control in VS.NET, downloaded to Microsoft's site, download address is: http://msdn.microsoft.com/downloads/samples/internet/Default.asp? URL = / Downloads / when samples / Internet / ASP_DOT_NET_ServerControls / WebControls / default.asp download for the first time after installation, you want to right-click the Toolbox Customize Toolbox ... after finding Micosoft.Web.UI.WebControls.Treeview → .NET Framework Components in check, so Treeview control It appears in the toolbox. First, the establishment of the tree is: Create a database, design the tree graph information table Tree_info, including NodeID, ParentID, NodeName, Adderss, Icon field, and other fields depending on the actual business, the node name NodeName will be in the node of the tree control The NodeID field saves the unique identification number of the node, and the ParentId represents the parent node number of the current node, the identification number consists of a "linked list", which records the structure of the node on the tree. Design a web form to place the TreeView control.
Private Sub CreateDataSet () 'data set to establish 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 = "basic idea" myCmd.Connection = myConn myDataAdapter.SelectCommand = myCmd myDataAdapter.Fill (ds, "tree") End sub achievements are: starting from the root recursively display the sub-tree 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.co Unt - 1) .nodes, intid) Next End Sub II, Add, Delete Tree Node Simply Add, Delete, Modify Nodes Simply Use Nodes Attributes Add, Remove, and Method, it is worth noting that it is VS. The nodes collection of TreeView in .NET is different from VS6.0, which is a big collection in VS6.0, and VS.NET is a nodes property under the hierarchical Node. Increase, delete, modify the tree node, which is very different from VS6.0, especially when deleting.
Private Sub ButAdd_Click (ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ButAdd.Click 'child node is added under the selected node Dim tmpNd As New TreeNode (), NdSel As TreeNode tmpNd.ID = GetNewId () NdSel = TreeView1.GetNodeFromIndex (TreeView1.SelectedNodeIndex) 'selected node tmpNd.Text = "new node" NdSel.Nodes.Add (tmpNd) Dim myRow As DataRow myRow = ds.Tables ( "tree"). NewRow () myRow ( "Node_name") = tmpnd.id myrow ("node_descript") = "new node" & tmpnd.id & "new 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 'delete the selected node 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 GetCol (Byval IDX AS String) As TreenodeCollection 'Nodes Collection Dim CNT AS Integer, i as Integer Dim Tmpnds as Treenode Collection Dim IDXS () AS String IDXS = Split (IDX, ".") CNT = Ubound (IDXS) IF CNT = 0 TMPNDS = TreeView1.nodes else Tmpnds = TreeView1.nodes (cint)). Nodes). Nodes For i = 1 to CNT - 1 TMPNDS = TMPNDS (CINT (IDXS (I)))). Nodes next end if return Tmpnds End Function 3, modified, mobile tree nodes are not like Windows because server controls do not support mouse drag The program is dragged by dragging the moving node, here is the way in which the parent node is selected. Mobile is achieved by deleting in the original location, the new location is implemented, pay attention to save the node information before deleting.
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 'mobile node 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' new parent node Node Collection Endiff Getcol (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.Rowfil Ter = "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 TreenodeCollection) AS Treenode 'by keyword Find Node DIM I AS Integer Dim Tmpnd As Treenode, Tmpnd1 As Treenode for Each Tmpnd In Nds if Tmpnd.id = ID TMPND EXIT FUNCTION END IF TMPND1 =
