ASP.NET Server Controls

All the controls have a unique functionality associated with it. They can be used for accessing web pages, validating data, develop master pages, navigating data, etc.

Depending on the functionality and use, the ASP.NET controls are differentiated into five different types as listed below.

1. HTML controls
2. HTML Server controls
3. ASP.NET Server controls
4. Ajax server controls
5. Custom and user controls

The server controls are divided into different categories as listed below.

1. Data Source controls: The controls are used for binding data to various sources.
2. Data View controls: The data controls like list and tables are used for displaying data by binding to the data source.
3. Validation controls: The user input is validated using the validation controls.
4. Master pages: A unique interface is provided for all the pages in the web application.
5. Personalization controls: The page is personalized as per the user information.
6. Rich controls: The controls provide rich user interface and functionality. The controls like Calendar, AdRotator, FileUpload, Multi View are used.
7. Login and security controls: The user authentication is provided using these controls.
8. Navigation controls: User can navigate through the data using the navigation controls. The menu, tree view, etc are used.

The general syntax for adding a server control is:

Code:

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

Properties of server controls

The server controls are derived from the Web Control class. All the events, methods and properties are inherited from the class. They are derived from System.Web.UI.Control class.

Some of the properties of the web server controls are as listed below.

1. Attributes: Collection of arbitrary attributes that are not related to the control properties.
   
2. AccessKey: The key along with the Alt key provides focus to the control.
   
3. BorderColor: The border color of the control is changed
   
4. BackColor: The background color of the control is modified
   
5. BorderStyle: The border style of the control can be changed
   
6. BindingContainer: The data binding of the control is present in the container.
   
7. ClientID: The control ID for the HTML markup is added
   
8. ChildControlCreated: It checks for the creation of child control for the corresponding server control
   
9. Context: The HTTPContext object is used with the server control
   
10. Controls: Collection of controls inside the control
    
11. Cssclass: The CSS class is present
    
12. DesignMode: It states whether the control is used in the design view
    
13. DataKeysContainer: The reference of the naming container implementing the IDataKeysControl is used.
    
14. DataItemContainer: The reference of the naming container implementing the IDataItemContainer is used.
    
15. EnableViewState: Checks whether the view state of the control is enabled
    
16. Events: The list of event handler delegates for the control
    
17. HasAttributes: Checks whether the control has attributes
    
18. ID: Used for identifying the control
    
19. IsTrackingViewState: It checks whether server control is saving the changes to the view state.
20. Site: It the container that hosts the control when rendered on the design view.
21. SkinID: It accesses or assigns the skin to be applied to the control
22. TagName: It retrieves the name of the control tag
23. ViewState: The directory of the state information is saved. The information about the view state of the server control is restored
24. Width: The width of the control is accessed or modified.
25. UniqueID: It is the unique identifier of the control

Methods of server controls

The list of methods provided by the server controls are:

1. AddedControl: It is called when the child control is added to the Collections object.
   
2. AddAttributesToRender: The HTML attributes and styles are added and rendered to the HtmlTextWriter Tag
   
3. ApplyStyleSheetSkin: The style properties are defined in the style sheet of the control.
   
4. ClearCachedClientID: The cached control client ID value is set to null.
   
5. ClearChildControlState: The control state data for all the server controls is deleted.
   
6. CreateChildControls: The child controls are created.
   
7. CreateControlCollection: A new ControlCollection object contains the child controls
   
8. CreateControlStyle: The style object used for implementing the style properties is created.
   
9. DataBind: It binds the data source to the server control and child controls
   
10. Dispose: The server control performs the clean up before the memory is released
    
11. Equals(Object): It checks whether the object is equal to the current object
    
12. Focus: It acquires the focus to the control
    
13. HasControls: Checks whether the control has child controls.
    
14. LoadViewState: The view state information is restored
    
15. MapPathSecure: The physical and virtual path, either absolute or relative is mapped.
    
16. MergeStyle: The non blank elements are copied to the web control. The existing elements are not overwritten.
    
17. OnInit: The Init event is raised
    
18. OnUnload: The Unload event is raised
    
19. Render: The control is rendered to the specific HTML writer.
    
20. RenderContents: The contents of the control are rendered to the specific writer
    
21. SaveControlState: The server control state is changed.
    
22. SetDesignModeState: The design time data of the control is set
    
23. TrackViewState: The modifications to the view state are tracked by the user. They are saved in the view state property of the object.

Example to demonstrate the server controls

Let’s consider the example to demonstrate the Tree View control in ASP.NET.
Following steps are performed for creating the server controls in ASP.NET application.

1. Open Visual Studio application in the system.
2. Create an ASP.NET web application.
3. Add a tree view control on the web page as shown below:
   
4. Select the Edit Nodes option from the list. Edit the nodes using the Tree View node editor.
   
5. Add the following code in the source view window of the application.
   
   Code:

   <form id="form1" runat="server">
   <asp:TreeView ID="TreeView1" runat="server" onselectednodechanged = "TreeView1_SelectedNodeChanged">
       <Nodes>
           <asp:TreeNode Text="School Information" Value="School Information">
           </asp:TreeNode>
           <asp:TreeNode Text="Home" Value="Home">
               <asp:TreeNode Text="Overview" Value="Overview">
               </asp:TreeNode>
               <asp:TreeNode Text="Academics" Value="Academics">
               </asp:TreeNode>
           </asp:TreeNode>
           
   <asp:TreeNode Text="Management" Value="Management">
               <asp:TreeNode Text="Staff" Value="Staff">
               </asp:TreeNode>
               <asp:TreeNode Text="Ajay Sharma" Value="Ajay Sharma" />
               <asp:TreeNode Text="Yogesh Singh" Value="Yogesh Singh" />
               <asp:TreeNode Text="Pravin Patil" Value="Pravin Patil" />
               </asp:TreeNode>
           </asp:TreeNode>
       </Nodes>
   </asp:TreeView>
   
   <div>
       <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
       <asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine">
       </asp:TextBox>
   </div>
   </form>
   
   

6. In the code behind file, add the following code.
   
   
   Code:

   
   using System;
   using System.Web;
   using System.Web.UI;
   using System.Web.UI.controls;
   using System.Linq;
   
   public partial class _Default: System.Web.UI.Page
   {
       protected void Page_Load(object sender, EventArgs e)
       {
           TextBox1.Text = " ";
       }
       protected void TreeView1_SelectedNodeChanged(object sender, EventArgs e)
       {
           TextBox1.Text=" ";
           Label1.Text = "The selected node is:"+TreeView1.SelectedNode.Text;
           TreeNodeCollection nodes = TreeView1.SelectedNode.ChildNodes;
           
           if ( nodes ! = null)
           {
               TextBox1.Text = " ";
               foreach( TreeNode t in nodes )
               {
                   TextBox1.Text += t.value;
               }
           }
       }
   }
   

7. Compile and execute the code and the following output is generated.