Working with TreeView WebControl Part 1 – Basics
One of the new gifts from .NET is Internet Explorer WebControls Version 1.0 of the ASP.NET Server Controls. This is a suite of “rich” controls that lets you easy deal with structures like TreeView, ToolBar, TabControl and Multipage that previously needed a lot of work to be developed.
In this three-part article Oscar Peli will describe one of these rich controls: TreeView. In this first part he will introduce you to the basics of this rich control. You will see your first TreeView built in a declarative mode and some others more complex samples; you will see also how to build a TreeView programmatically.
The second and third parts of this article are focused on more advanced features of this control: handling events (http://www.asptoday.com/content.asp?id=1858) and data binding (http://www.asptoday.com/content.asp?id=1859).
The TreeView is one of the most useful structures in web development. In this first part of my article I want to introduce to you a wonderful control that Microsoft released for the .NET Framework. Here you have a control with a rich Object Model that lets you program various aspects by simply defining the value of some properties, or by declaring some elements.
Download and Install WebControls
Before reading this article it will be useful if you have downloaded and installed Microsoft Internet Explorer WebControls Version 1.0 of the ASP.NET Server Controls
From the dropdown list "WebControls Version 1.0 Installation Options " choose "Automatic Install: WebControls Version 1.0 Client DHTML Behaviors and Server Controls ".
Wait until the browser prompts you to save or execute the file (iewebcontrols.msi), then save it on your hard disk and execute it.
At the end of installation, you can see in the Programs menu, which can be accessed from the Start button, the "Microsoft Internet Explorer WebControls " entry. There you can find a shortcut to the IE WebControls MSDN documentation and a readme file where you can read the step by step installer operations.
The Simplest TreeView
The first sample of a TreeView is a very simple program, the source code for it can be found in the FirstTree.aspx file in the support material of this article. I won't describe everything, but I will describe the lines that are directly concerned with the TreeView control.
The first line is an @Import directive for the WebControls. This explicitly imports a namespace into the page, making all classes and interfaces of the imported namespace available. (If you want to know more on the @Import directive point your browser to http://msdn.microsoft.com/library/en-us/cpgenref/html/cpconimport.asp.)
<%@ import namespace="Microsoft.Web.UI.WebControls" %>
The second line is an @Register directive that associates an alias with the namespace and class name for concise notation. Including this directive in a page allows you to layout a TreeView server control using declarative TreeView syntax.
If you want to know more on the @Register directive point your browser to http://msdn.microsoft.com/library/en-us/cpgenref/html/cpconregister.asp.
<%@ Register TagPrefix="myfirsttree" Namespace="Microsoft.Web.UI.WebControls" Assembly="Microsoft.Web.UI.WebControls, Version=126.96.36.199,
Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
Note that all WebControls elements must be authored inside a Form element. The runat="server" attribute has also to be specified for the Form to indicate that ASP.NET will process the results of any user input. So the TreeView element is a child of the Form and has the runat="server" attribute too.
Note the use of the tag prefix myfirsttree; this will be used for all the WebControls elements in the page since it has been predefined in the @Register directive.
<HTML> <HEAD></HEAD> <BODY> <FORM runat="server"> <myfirsttree:treeview runat="server" SHOWTOOLTIP="false">
Inside the TreeView element you can insert TreeNode elements to build your structure. To produce a hierarchical structure of nodes, simply add a child TreeNode element inside his parent element.
User ReviewsTotal of 10 reviews
Download Code link is wrongWritten by Jonathan Smith on January 15, 2005
The link is wrong for the code download it should be http://www.dnzone.com/downloads/tutorial_aspoct_1.zip/articles_200200902_1.zip
I can't download the codeWritten by Natalia nat on September 8, 2003
Something is not right, I can't download the code. How can I get it? Thanks
Problems with Treeview Web ControlWritten by Martin Berndt on June 12, 2003
I tried to install the Microsoft web Controls from the Microsoft Page. I copied the Microsoft.web.ui.webcontrols.dll to the \bin Folder of my Web Application,how it is explained in the readme.txt, but this didn't work. Has anyone the same Problem? ...
Failing to download exampleWritten by Esse Johansson on June 10, 2003
Hello I am failing to download the example code from this site. According to the comments it has also previous been a problem. Is it a new error now? Could the error be that the link contains one zero to much in the date? 200200902 Best regards Esse
FirstTree.aspx- where is it?Written by zi makki on June 3, 2003
Hello all, I seem to be having the same problems as a lot of other people :S where is FirstTree.aspx Zi
How do I download the code?Written by rajitha bandapelly on April 10, 2003
Is there someway I can download the code for this article? Thanks, Rajitha
RE: Code for FirstTree.aspx - where can I get it from?Written by Gabriele Bonanomi on March 5, 2003
RE: RE: Code for FirstTree.aspx - where can I get it from?Written by Aaron Jay on November 28, 2002
Im not actually seeing any sort of download button for the code for this article. I am logged in so maybe im missing something?