How to pass a value from User Control to the Page

Introduction

In this article, I am going to show you how to get a particular value entered by the user from user control to the calling page. In order to do that I am going to create a user control (.ascx) and a page (.aspx) page like shown in the picture below.

User Control (WriteThisMessageToThePage.ascx)

In this user control, I am going to place a TextBox and a button like picture below. The functionality should work like this. If I write something in the TextBox and click the button, the value of the textbox should be written into the Label control of the .aspx page.

To do that I need to create a delegate so I have created a delegate named SendMessageToThePageHanlder(string messageToThePage) just above the class declaration for the user control. You will have to make sure that it is outside the scope of class declaration otherwise it will not work. Then I have created a variable called sendMessageToThePage for this delegate. In the click event of the button, I am first checking if the delegate is not null then passing the textbox value to it. You may be wondering why we are passing textbox value to this delegate. This is because this value we have to get into the calling page so from the calling page. I will simply call this delegate on the calling page (will talk later in this article).

So my code for user control will look like following

Code for WriteThisMessageToThePage.ascx

<table>
<tr>
<td>My Name: <asp:TextBox ID="txtName" runat="Server"></asp:TextBox></td>
</tr>
<tr>
<td><asp:Button ID="Button1" runat="server" OnClick="Button1_Clicked" Text="Send TextBox Value to the Page" /></td>
</tr>
</table>

Code for WriteThisMessageToThePage.ascx.cs (code behind)

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
 
public delegate void SendMessageToThePageHandler(string messageToThePage);
 
public partial class UserControl_WriteThisMessageToThePage : System.Web.UI.UserControl
{
public event SendMessageToThePageHandler sendMessageToThePage;
 
protected void Page_Load(object sender, EventArgs e)
{
 
}
/// <summary>
/// Fires when button is clicked
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void Button1_Clicked(object sender, EventArgs e)
{
     if (sendMessageToThePage != null)
     {
         sendMessageToThePage(txtName.Text);
     }
}
}

Calling page (default.aspx)

In the default.aspx page (the page that is calling/using the user control), I am going to place an asp:Label control to write the value of the TextBox. In the Page_Load method of the page, I will attach the delegate of the user control and pass the variable called message so that I will have the textbox value in that variable (Remember, we had  passed the textbox value into the delegate in the user control). Then simply specify the Text property of the Label control to the variable and we are done!!!

My code for .aspx page looks like following

Code for default.aspx

<form id="form1" runat="server">
<h3>Demo of passing User Control value to the page</h3><hr />
<div>
<uc1:WriteThisMessageToThePage id="WriteThisMessageToThePage1" runat="server">
</uc1:WriteThisMessageToThePage></div>
<br /><br />
Value of user control TextBox is: <asp:Label ID="lblUserControlTextBoxValue" runat="Server" Font-Bold="True"></asp:Label><hr />
</form>

Code for default.aspx.cs (Code behind)

protected void Page_Load(object sender, EventArgs e)
{
WriteThisMessageToThePage1.sendMessageToThePage += delegate(string message)
{
lblUserControlTextBoxValue.Text = message;
};
}

Test it!!!. If you have exactly followed my steps simply run the page and enter something into the textbox (that is placed in the user control) and hit the button, you should see the value of the textbox into the Label control (placed on the .aspx page).

Conclusion

Here we saw how beautifully a delegate can be used to pass value from a user control to the page.

Thanks and Happy Coding !!!

To pass a value from .aspx page to the user control, see this article http://www.dotnetfunda.com/articles/article16.aspx