How to use the. NET Treeview Control

Source: Internet
Author: User
Tags microsoft website
The really useful feature of ASP. NET is its scalability. Developers around the world can create their own custom controls, which can be easily defined in your own process. Internet Explorer Web controls is a collection created by Microsoft outside the standard ASP. NET control.
In Windows resource manager, the drive and its files and folders are arranged in a hierarchical structure, in this control set, there is a Treeview control that provides a hierarchical display of information. The Treeview control contains a list of entries called "nodes. Each node can have its own node set, providing a deeper data definition. Each node can be folded to allow a visitor to search in a Treeview control and view only the level of data that he is interested in. Just like Windows Resource Manager.

The first thing to clarify is the test environment. As long as the environment is correct, the next work will be very easy:
To test this control, you must have an IE webcontrols file. For specific files, click here to download them or download them from Microsoft Website:

Install the SDK according to the provided method. If you have any questions, read the README document carefully.

Here, the download method is skipped and the environment configuration is directly entered:
IE Web controls
1. Double-click the installation. Default Value: System Disk:/program files/ie Web controls directory.
2. Run "program -- Microsoft Visual Studio. NET 2003 -- Visual Studio. NET tool -- Microsoft Visual Studio. NET 2003 command prompt" to go To the IE web control installation directory.
3. Run build. bat.
4. Run xcopy/S/I./build/Runtime (website root directory, default system disk):/inetpub/wwwroot/webctrl_client/defaults 0/y.

Right-click the toolbox -- web form and choose Add/Remove from the shortcut menu... in the pop-up dialog box, select. net framwork component, Click Browse, and find ie webcontrol. DLL file. Add it.

In this way, the runtime environment is configured. The following is the implementation phase.

1. Define the Treeview Control

Code copy box
'Import namespace
<% @ Import namespace = "Microsoft. Web. UI. webcontros" %>
'Register the namespace and give it a tagprefix to facilitate definition of controls in this control library
<% @ Register tagprefix = "iecontrols"
Namespace = "Microsoft. Web. UI. webcontrols"
Assembly = "Microsoft. Web. UI. webcontrols"
%>
'After setting the command, you can define the following Treeview control.
<Iecontrols: Treeview
Id = "tvbasic"
Autoselect = "false"
Shoplus = "true"
Showlines = "true"
Expandlevel = 2
Runat = "server"
>
----------
</Idcontrols: Treeview>

The corresponding code is explained below:
 Autoselect = "false"
When you locate a node in the Treeview control, you can use the arrow on the keyboard to locate the node. when the Autoselect attribute value of the Treeview control is set to true, you can use the keys on the keyboard to scroll in the Treeview control to select an entry. this is not allowed if it is set to false.
Showplus = "true"
When two nodes in a Treeview control receive a combination, you can display a plus sign (+), and visitors will know that the node can be expanded. by setting the showplus attribute, you can control whether the plus sign is displayed at this position. if this property value is set to true, the plus sign is used; otherwise, no.
Showlines = "true"
You can display lines between two nodes in a Treeview control. By setting the showlines attribute, you can control whether to display such lines.
Expandlevel = 2
The expandlevel attribute of the Treeview control is used to determine the number of levels that are expanded along the hierarchy of the Treeview control by default.
<Iecontrols: Treeview>
---------
</Iecontrols: Treeview>

You can define some treenode controls between the start and end labels defined by the Treeview control.

2. Use the treenode control in the Treeview Control

If you create a Treeview control, you need to add some treenode controls to display some information. the treenode control is displayed as an item in the hierarchy of the Treeview control. the treenode control can contain the Treeview control. Alternatively, the control can exist independently. the following describes how to define the treenode control in a Treeview control.
This example shows some of my favorite websites, each of which can be an independent website, or there are other websites under it. This Treeview control has the following definitions:

Code copy box
<Iecontrols: Treeview
Id = "tvwebsite"
Autoselect = "false"
Showplus = "true"
Showlines = "true"
Expandlevel = 2
Runat = "server"
>
'Next, define the treenode control in the start and end labels of the Treeview control.
<Iecontrols: treenode text = "my usual sites">
<Idcontrols: treenode text = "design site">
<Idcontrols: treenode text = "Blue ideal"/>
<Idcontrols: treenode text = "windy days"/>
<Idcontrols: treenode text = "design alliance"/>
</Iecontrols: treenode>
<Iecontrols: treenode text = "programming site">
<Iecontrols: treenode text = "ASP programming">
<Iecontrols: treenode text = "ASP cool"/>
<Iecontrols: treenode text = ""/>
</Iecontrols: treenode>
<Iecontrols: treenode text = "ASP. NET programming">
<Iecontrols: treenode text = "DOTNET"/>
<Iecontrols: treenode text = "Asp.net"/>
</Iecontrols: treenode>
<Iecontrols: treenode text = "Programmer base camp"/>
</Iecontrols: treenode>
</Iecontrols: treenode>

A two-level node is defined. this tree view contains two big nodes: "design site" and "programming site, there are two subnodes in "programming site", "ASP programming" and "Asp.net programming". Each subnode defines other nodes.
Note the differences between the treenode control and the independent treenode control that contains other nodes. when a treenode control contains other treenode controls, these child controls are defined between the start and end tags of their parent controls:
 <Iecontrols: treenode text = "">
</Iecontrols: treenode>

However, for an independent treenode control, its start and end tags are self-contained:
<Iecontrols: treenode text = ""/>
When the page is loaded for the first time, this is the expansion of the entire view node. because the expandlevel attribute value is set to 2, nodes of all levels are displayed. in addition, because the showlines and showplus attributes are both true, the lines and Connection boxes between connection nodes are displayed in all displayed views.

"My usual sites" is the selected node item. visitors can press ENTER or click the mouse on the node. then, visitors can use the arrow on the keyboard to locate the hierarchy of the Tree View.

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.