Controls are small building blocks of the graphical user interface, which include text boxes, buttons, check boxes, list boxes, labels, and numerous other tools. Using these tools, the users can enter data, make selections and indicate their preferences.

Controls are also used for structural jobs, like validation, data access, security, creating master pages, and data manipulation.

ASP.NET uses five types of web controls, which are:

• HTML controls
• HTML Server controls
• ASP.NET Server controls
• ASP.NET Ajax Server controls
• User controls and custom controls

ASP.NET server controls are the primary controls used in ASP.NET. These controls can be grouped into the following categories:

• Validation controls – These are used to validate user input and they work by running client-side script.

• Data source controls – These controls provides data binding to different data sources.

• Data view controls – These are various lists and tables, which can bind to data from data sources for displaying.

• Personalization controls – These are used for personalization of a page according to the user preferences, based on user information.

• Login and security controls – These controls provide user authentication.

• Master pages – These controls provide consistent layout and interface throughout the application.

• Navigation controls – These controls help in navigation. For example, menus, tree view etc.

• Rich controls – These controls implement special features. For example, AdRotator, FileUpload, and Calendar control.

The syntax for using server controls is:

<asp:controlType  ID ="ControlID" runat="server" Property1=value1  [Property2=value2] />

In addition, visual studio has the following features, to help produce in error-free coding:

• Dragging and dropping of controls in design view
• IntelliSense feature that displays and auto-completes the properties
• The properties window to set the property values directly

Properties of the Server Controls

ASP.NET server controls with a visual aspect are derived from the WebControl class and inherit all the properties, events, and methods of this class.

The WebControl class itself and some other server controls that are not visually rendered are derived from the System.Web.UI.Control class. For example, PlaceHolder control or XML control.

ASP.Net server controls inherit all properties, events, and methods of the WebControl and System.Web.UI.Control class.

The following table shows the inherited properties, common to all server controls:

Methods of the Server Controls

The following table provides the methods of the server controls:

Example

Let us look at a particular server control – a tree view control. A Tree view control comes under navigation controls. Other Navigation controls are: Menu control and SiteMapPath control.

Add a tree view control on the page. Select Edit Nodes… from the tasks. Edit each of the nodes using the Tree view node editor as shown:

Once you have created the nodes, it looks like the following in design view:

The AutoFormat… task allows you to format the tree view as shown:

Add a label control and a text box control on the page and name them lblmessage and txtmessage respectively.

Write a few lines of code to ensure that when a particular node is selected, the label control displays the node text and the text box displays all child nodes under it, if any. The code behind the file should look like this:

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;

using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;

using System.Xml.Linq;
 
namespace eventdemo {
   public partial class treeviewdemo : System.Web.UI.Page {
   
      protected void Page_Load(object sender, EventArgs e) { 
         txtmessage.Text = " "; 
      }
      
      protected void TreeView1_SelectedNodeChanged(object sender, EventArgs e) {
      
         txtmessage.Text = " "; 
         lblmessage.Text = "Selected node changed to: " + TreeView1.SelectedNode.Text;
         TreeNodeCollection childnodes = TreeView1.SelectedNode.ChildNodes;
         
         if(childnodes != null) {
            txtmessage.Text = " ";
            
            foreach (TreeNode t in childnodes) {
               txtmessage.Text += t.Value;
            }
         }
      }
   }
}

Execute the page to see the effects. You will be able to expand and collapse the nodes.