User Control in Asp.Net:
Overview:
User Controls are used inorder to avoid rework & reduce complexity of the application, It provides reusability of the code.
For example if we have to display the grid view at different places in the project what we will do is copy the whole HTML & CSS of the grid and paste it where ever required. This makes the whole project complex & clumsy, the better way is to make a user control of the grid and render it whereever required.
To make a user control, make a new web project, right click on the project's name . Select 'Add' then 'Add Web User Control' . The wizard produces two files: .ascx file containing the visual layout, and a .ascx.cs that has the business logic. Now in this ascx file we can write our HTML & CSS whereas the ascx.cs file will contain the business logic.
For Example the user control for displaying the table will look like:
<%@ Control Language="c#" AutoEventWireup="false"
Codebehind="MyUserControl.ascx.cs"
Inherits="CodeProject.MyUserControl"
TargetSchema="http://schemas.microsoft.com/intellisense/ie3-2nav3-0"%>
<asp:table id=OuterTable BackColor=#c0c0c0c BorderWidth=0 cellPadding=0
cellSpacing=1 width='100%' Runat="server">
<asp:tableRow><asp:tableCell width="100%">
<asp:table id=InnerTable BackColor=#cccccc BorderWidth=0 cellPadding=0
cellSpacing=1 width="100%" Runat="server">
<asp:tableRow<asp:tablecell HorizontalAlign=Center>
<asp:Label ID=TitleLabel Runat="server" />
</asp:tablecell></asp:tableRow>
</asp:table>
</asp:tablecell></asp:tableRow>
</asp:table>
Now if we want to use this user control on any page, we have to first register the user control on that page by writing the following code at the top of the page:
<%@ Register TagPrefix="CP" TagName="TitleBar" Src="MyUserControl.ascx" %>
After which we can render the control whereever on the page as follows:
<CP:TitleBar Title="User Control Test" TextColor="green" Padding=10 runat="server" />
Note:-> The TagPrefix and the TagName can be changed to any prefix or name we want as long as there are no conflicts.
Example of rendering the user control:
<%@ Register TagPrefix="CP" TagName="TitleBar" Src="MyUserControl.ascx" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html>
<head>
<title>MyPage</title>
</head>
<body>
<basefont face=verdana>
<CP:TitleBar Title="User Control Test" TextColor="green" Padding=10 runat="server" />
</body>
</html>
0 Comment(s)