Scribd
Upload
18 views

09 - Working With User Control

Uploaded by

Gabriel Ladino
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
18 views

09 - Working With User Control

Uploaded by

Gabriel Ladino
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Deccansoft Software Services - ASP.

NET User Controls

Agenda

1. Overview of User Controls


2. Creating a User Control
3. Adding Properties to User Control
4. Adding Events to User Control
5. Using User Control in Web Form
6. Rendering Client Scripts using Page.ClientScript methods

1
Deccansoft Software Services - ASP.NET User Controls

Overview of User Controls


1. Using User Control we can reuse both User Interface and Code at different places within the same Web Form or
in different Web Forms of the same web application. It has the extension - .ascx
2. The ascx file has a Control directive and the class is inherited from “System.Web.UI.UserControl”.
3. When a User Control is dragged and dropped onto the Web Form (design view), <%@Register directive is added
to the Web Form with TagPrefix and TagName as attributes. For every instance of the User Control in the form,
the tagprefix and tagname are used.
4. The Controls in User Control cannot be directly accessed in the Web Form thus for customizing the User Control,
public properties must be added to it. These public properties in most of the circumstances wrap around the
controls which are added to the User Control. In the Example below RealName is the wrapper around
txtFirstName and txtLastName Text Property; Caption is the wrapper around lblCaption Text Property.
5. User control does not reflect change in properties in design view of the Web Form. The Properties of the User
Control can be set by setting the attributes for the User Control tag used in Web Form.
6. When the controls in User Control are rendered to the web browser, the Id attribute of it is rendered as “X_Y”,
where X is Id of User Control as set in Web Form and Y is id of Control as set in User Control. The “Name”
attribute is rendered as “X$Y”. On server the client id of a control as rendered to be browser can be accessed
using ServerId.ClientID and Client side Name can be accessed using ServerId.UniqueID.

Example: To the project as UserControl by name HelloControl


User Control
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="HelloControl.ascx.cs" Inherits=" HelloControl" %>
<asp:Label ID="lblCaption" runat="server" Text="Name:"></asp:Label>
<asp:TextBox ID="txtFirstName" runat="server"/>
<asp:TextBox ID="txtLastName" runat="server"/>
Step 2:
HelloControls.acsx.cs: To this file add the following code.
public partial class HelloControl : System.Web.UI.UserControl
{
//This event is raised when either FirstName or LastName is changed.
public string RealName
{
get
{
return txtFirstName.Text + " " + txtLastName.Text;
}
set
{
txtFirstName.Text = value.Split(' ')[0];
txtLastName.Text = value.Split(' ')[1];
}
}
//The Following property is used in the Web Form to set the Text of Label.
public string Caption
{
get
{
return lblCaption.Text;
}
set

2
Deccansoft Software Services - ASP.NET User Controls

{
lblCaption.Text = value;
}
}
}
Code: 1.5 C#
Step 3: Add a Web Form to the Application (Default.aspx)
Step 4: Drag HelloUser Control from Solution explorer and on the design view of the Web Form. This adds the
following to the Web Form (Default.aspx).
<%@ Register Src="HelloControl.ascx" TagName="HelloControl" TagPrefix="uc1" %>
Step 5: Add another User Control and change the Id to “hcName” and “hcFathersname”. Also add a button to the
Web Form.
Using User Control
<uc1:HelloControl ID="hcName" runat="server" Caption=”Your Name” RealName="Test Test"/>
<uc1:HelloControl ID="hcFathersName" runat="server" RealName="Z Y" Caption="Fathers Name"/>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click"/>
Step 6:
Handling btnSubmit click event
protected void btnSubmit_Click(object sender, EventArgs e)
{
Response.Write(hcName.RealName);
Response.Write("<br>" + hcFathersName.RealName);
}
Code: 1.5 C#

Page.ClientScript Class

Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "k1", "alert('demo')", true);

The above function renders the Javascript code (including the script tag) only once irrespective of number of times
the above line is executed

This should be written in Page_Load event of User Control in situations where multiple instances of User Control will
be included in the Web Form.

You might also like