June 2, 2009

Access Data From User Control

A user control can contain other controls like TextBoxes or Labels. These control are declared as protected members. This means that data from and for these controls are only available to the particular user control or to classes that extends this particular user control.

To access data from a page with a user control, the user control needs to expose the properties as public properties or public methods.
In this example, I will first create a user control containing a couple of TextBoxes and expose the properties publicly so they can be used by a page that contains the user control.

The code for the user control is below:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="UserControlPrac.ascx.cs" Inherits="UserControlPrac" %>
FirstName: <asp:TextBox ID="TextBoxFirstName" runat="server"></asp:TextBox><br />
LastName: <asp:TextBox ID="TextBoxLastName" runat="server"></asp:TextBox>

Here, there are 2 Textboxes with id TextBoxFirstName and TextBoxLastName.

The code for the code-behind for the page is below:

public partial class UserControlPrac : System.Web.UI.UserControl
    protected void Page_Load(object sender, EventArgs e)
    {    }

    public string FirstName
        get { return TextBoxFirstName.Text; }
        set { TextBoxFirstName.Text = "firstname"; }

    public string LastName
        get { return TextBoxLastName.Text; }
        set { TextBoxLastName.Text = "lastname"; }

Here, I have 2 public properties FirstName and LastName. The properties returns the values for the Textbox controls on the page. I can also set the values to some default values.

Now, on the main, I register the usercontrol and then add a button to the page. The code is below:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="UserControlPracTest.aspx.cs" Inherits="UserControlPracTest" %>
<%@ Register src="UserControlPrac.ascx" tagname="UserControlPrac" tagprefix="uc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
    <form id="form1" runat="server">
        <uc1:UserControlPrac ID="UserControlPrac1" runat="server" />   
    <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" />

On code-behind:

public partial class UserControlPracTest : System.Web.UI.Page
    protected void Page_Load(object sender, EventArgs e)
    protected void Button1_Click(object sender, EventArgs e)
        Response.Write("first name: " + UserControlPrac1.FirstName);
        Response.Write("<br/>last name: " + UserControlPrac1.LastName);

When the button is clicked, I am writing the values in the Textbox controls based on what was passed in by the user.


Janis Baldwin said...

Well this is the FIRST webuser control example I've ever gotten to work! Usually get half-way thru then get wavy red line under something. So many examples of communication between web form (parent) and web user control are complicated and confusing. Thanks for the simple, straightforward example.

Reference: Shahed Kazi at AspNetify.com