Use the Treeview control in ASP. NET

When browsing the Internet, some websites sometimes use a tree structure similar to the resource manager on the left. click in the tree structure to display the content on the right, which is clear, convenient, and fast, this article mainly introduces ASP. NET Server Control Treeview usage, Treeview control is Microsoft webcontrols, during the download and use process I encountered some problems, through repeated experiments, find information, find some solutions, this article describes how to use Treeview to help users who want to use tree structures on their websites.

　　1. Download

The Microsoft webcontrols control consists of four components: multipage, tabstrip, toolbar, and Treeview. You can go to program files to create ie Web controls and execute the following bulid. if you cannot use bat after installation, use the following methods:

If its path does not match your computer, modify the disk and run bulid. bat. Microsoft. Web. UI. webcontrols. dll and some folders are obtained.

2. view the default web site. Generally, the default web site is c: \ Inetpub \ wwwroot. If not, open the management tool à Internet service manager. Method: right-click the default web site and choose Properties> Home Directory to modify the home directory.

3. Copy all the content in the runtime folder under c: \ Program Files \ IE Web controls \ build to the main directory \ webctrl_client \ Program 0, is to copy the system files of the four major controls of iewebcontrols to the default web site.

4. Copy the Microsoft. Web. UI. webcontrols. dll file under c: \ Program Files \ IE Web controls \ build to the project Folder \ bin created in the main directory.

Iewebcontrols can be used normally through the preceding operations.

　　2. Add controls

Open Microsoft Visual Studio.. net, right-click the Web Toolkit, and select Custom toolkit.. NET Framework component, add Microsoft. web. UI. webcontrols. DLL file. in the. NET Framework component, select the namespace as Microsoft. web. UI. webcontrols Treeview.

　　Iii. Introduction to Treeview attributes and Methods

Add a Treeview control to the form, and create a required tree structure using the property nodes of the Treeview object.

For example, create the following Tree Structure

The HTML code in the form is:

<Iewc: Treeview id = "treeview1" Autoselect = false shoplus = true showlines = true expandlevel = 2 runat = Server> <Iewc: treenode text = "subject"> <Iewc: treenode text = ""/> <Iewc: treenode text = "Mathematics"/> <Iewc: treenode text = "English"/> </Iewc: treenode> </Iewc: Treeview>

1. Autoselect = "false": when a visitor locates a node in the Treeview control, the arrow on the keyboard can be used to locate the node. If the property value is "false", this operation is not allowed.

2. showplus = "true": when the two nodes receive the same result, you can display a plus sign (+), and the visitor will know that the node can be expanded, if the property value is "true", the plus sign is used. Otherwise, the plus sign is not used.

3. showlines = "true": some line lengths can be displayed between two nodes in a Treeview control, which is "true.

4. expandlevel = 2: the number of levels used to define the hierarchy expansion of the Treeview control.

5. navigateurl: Jump URL when you click a node

For example:

<Iewc: Treeview id = "treeview2" runat = Server> <Iewc: treenode text = "favorite site"> <Iewc: treenode text = "China DOTNET Club" navigateurl = "http://www.chinaaspx..com"/> <Iewc: treenode text = "National Basic Education Resource Network" navigateurl = "htt: // www.cbern.gov.cn"/> </Iewc: treenode> </Iewc: Treeview>

6. Index: Obtain the position of a tree node in the tree node set.

7. nodes: gets the set of Tree nodes allocated to the Tree View control.

8. Parent: gets or sets the parent container of the control.

9. selectednode: gets or sets the currently selected tree node in the Tree View control.

10. Text: Get or set the text displayed in the tree node label.

11. Expand: Expand the tree node

12. Clear: Clear the tree

13. Remove: remove the current Tree node.

14. Checked: Used to indicate whether the tree node is selected

　　Iv. Simple Example

Select the tree structure on the left and query the results in the right table.

Note:

1. The selectedindexchange event is generated when the tree structure is selected. There is also a trigger condition autopostback = true.

2. In this example, the database is created by SQL 2000.

The Code is as follows:

Imports system. Data Imports system. Data. sqlclient Public class tree1 Inherits system. Web. UI. Page Protected withevents button1 as system. Web. UI. webcontrols. Button Protected withevents datagrid1 as system. Web. UI. webcontrols. DataGrid Protected withevents label1 as system. Web. UI. webcontrols. Label Protected withevents label2 as system. Web. UI. webcontrols. Label Private sub button#click (byval sender as system. Object, byval e as system. eventargs) handles button1.click Dim strconnection as string = "Server = zln \ netsdk; uid = sa; Pwd = sa; database = English" Dim conn as new sqlconnection (strconnection) Conn. open () Dim SQL as string = "select * From zlk where Kemu = '" & SESSION ("Node"). tostring &"'" Dim cmd as new sqlcommand (SQL, Conn) Dim da As sqldatareader DA = cmd. executereader Datagrid1.datasource = da Datagrid1.databind () End sub Private sub treeviewincluselectedindexchange (byval sender as object, byval e as Microsoft. Web. UI. webcontrols. treeviewselecteventargs) handles treeview1.selectedindexchange Dim ndsel as new Microsoft. Web. UI. webcontrols. treenode () Ndsel = treeview1.getnodefromindex (treeview1.selectednodeindex) Session ("Node") = ndsel. Text End sub End Class