Summary of using the Treeview control in ASP. NET

Source: Internet
Author: User
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

HTML in the formCodeIs:

<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 = "Chinese 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

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.