Handling User Control Events on Containing Page

Question

I want to have a user control containing a save button.

I want the click event attached to the save button to be handled by the containing page not the user control

Is this possible?

EDIT MORE SPECIFIC

Say I have a page called "Editor Page" and a user control called "Editor Buttons". On the "Editor Buttons" user control I have a save button (which is a web control). I want the Click event of the save button to be handled by the "Editor Page" rather than the user control.

The reason for this is because I want to specify base pages that implement common behaviour.

score 7 · Answer 1 · edited Mar 19 '13 at 09:05

This technique is commonly referred to as “event bubbling”.

Here is an exmple:

public partial class Test : System.Web.UI.UserControl

{

 public event EventHandler buttonClick;

 protected void Button1_Click(object sender, EventArgs e)
 {
     buttonClick(sender, e);
 }

}

Then you can subscribe the event buttonClick at webpage to display the different information .

public partial class Test: System.Web.UI.Page
 {
 protected void Page_Load(object sender, EventArgs e)
 {

 UserControlID.buttonClick+=new EventHandler(UserControlID_buttonClick);

}

protected void UserControlID_buttonClick(object sender, EventArgs e)
 {
     Response.Write("hello,I am jack.");
 }

}

What if the UserControl that needs to pass the event to the holding page is one of many types of dynamically rendered UserControl — taimur alam, Nov 23 '18 at 12:23

score 6 · Accepted Answer · edited May 23 '17 at 10:28

I will assume that you have the code for the UserControl. If that is the case, you can define a Save event in your user control and have it expose the Click event of the save button, either directly, or by internally setting up an event handler and raise the Save event when the button is clicked. That could look something like this in the UserControl:

public event EventHandler Save;

private void SaveButton_Click(object sender, EventArgs e)
{
    OnSave(e);
}

protected void OnSave(EventArgs e)
{
    // raise the Save event
    EventHandler save = Save;
    if (save != null)
    {
        save(this, e);
    }
}

score 1 · Answer 3 · answered Mar 19 '13 at 08:52

UserControl1.ascx

UserControl1.ascx.cs

public partial class UserControl1 : System.Web.UI.UserControl

{

public event EventHandler UserControl1Click;



protected void Page_Load(object sender, EventArgs e)

{

}



protected void btn1_Click(object sender, EventArgs e)

{

    UserControl1Click(sender, e);

}

}

UserControl2.ascx

UserControl1.ascx.cs

public partial class UserControl2 : System.Web.UI.UserControl

{

public event EventHandler UserControl2Click;



protected void Page_Load(object sender, EventArgs e)

{

} 




protected void btn2_Click(object sender, EventArgs e)

{

    UserControl2Click(sender, e);

}

}

Then add one Asp.Net Text box(to display user control id) and above two user controls to Aspx page as shown below.

<title>Untitled Page</title>

<form id="form1" runat="server">



<div>



<asp:TextBox ID="txt1" runat="server"></asp:TextBox> <br />



<UC1:UC ID="uc1" runat="server" />



<UC1:UC ID="uc2" runat="server" />



</div>



</form>

Now add event handler for each user control to handle button click event of two controls as shown below.

public partial class _Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

    uc1.UserControl1Click += new EventHandler(uc1_UserControl1Click);

    uc2.UserControl2Click += new EventHandler(uc2_UserControl2Click);

}



protected void uc1_UserControl1Click(object sender, EventArgs e)

{

    txt1.Text = "User Control 1 Clicked";

}



protected void uc2_UserControl2Click(object sender, EventArgs e)

{

    txt1.Text = "User Control 2 Clicked";

}

}

If we click User Control1, text box displays “User Control 1 Clicked” or if we click on User Control2, text box displays “User Control 2 Clicked”.

Handling User Control Events on Containing Page

3 Answers3

Linked