从ASP.NET中的Web用户控件冒泡的事件

时间:2012-06-30 15:10:49

标签: asp.net user-controls event-bubbling

我在PageDefault.aspx中有两个UserControls - UserControl1.ascx和UserControl2.ascx:

如何使用事件冒泡从GetLabelText() in UserControl1.ascx调用方法(UserControl2.ascx)?

这是我的示例代码 - 当我点击按钮(UserControl2Button1 in UserControl1.ascx)时 - 我想调用方法GetLabelText() from UserControl2.ascx - 使用事件冒泡。

PageDefault.aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PageDefault.aspx.cs" Inherits="TelerikAjaxEvents.PageDefault" %>
<%@ Register TagPrefix="uc" TagName="UserControl1" Src="~/UserControl1.ascx" %>
<%@ Register TagPrefix="uc" TagName="UserControl2" Src="~/UserControl2.ascx" %>
<!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>Page Default</title>
</head>
<body>
    <form id="form1" runat="server">
        UserControl1:
        <uc:UserControl1 ID="UserControl1" runat="server" />

        UserControl2:
        <uc:UserControl2 ID="UserControl2" runat="server" />

    </form>
</body>
</html>

UserControl1.ascx

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UserControl1.ascx.cs" Inherits="TelerikAjaxEvents.UserControl1" %>
<asp:Label ID="UserControl1Label1" runat="server"></asp:Label>

UserControl1.ascx.cs

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

        }

        public void GetLabelText() 
        {
            UserControl1Label1.Text = "Text is Visible";
        }
    }

UserControl2.ascx

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UserControl2.ascx.cs" Inherits="TelerikAjaxEvents.UserControl2" %>
<asp:Button ID="UserControl2Button1" runat="server" Text="Send" 
    onclick="UserControl2Button1_Click" />

UserControl2.ascx.cs

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

        }

        protected void UserControl2Button1_Click(object sender, EventArgs e)
        {
            //Call method from UserControl1 (GetLabelText()) - Show Label text - USING BUBBLE EVENT
        }
    }

3 个答案:

答案 0 :(得分:5)

有很多方法可以解决这个问题。 Mark的回答提示使用System.Web.UI.Control基本控件的内置功能部分,通常称为事件冒泡。但是,通过控件层次结构公开自己的事件,绑定它并冒泡事件是一个简单的练习。有关在ASP.NET中使用BubbleEvent的更多详细信息,请阅读以下内容。请记住,这两篇MSDN文章都是为.NET 1.1编写的

Bubbling an Event

Event Bubbling Control Sample

ķ。斯科特·艾伦(Scott Allen)很好地展示了他的帖子中的“事件冒泡”实现:Event Bubbling From Web User Controls in ASP.NET (C#) 。请参阅以下修改示例以获取灵感。

UserControl1 with GetLabelText()

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

    }

    public void GetLabelText() 
    {
        UserControl1Label1.Text = "Text is Visible";
    }
}

带有公开的BubbleClick事件处理程序的UserControl2,调用者可以订阅。

public partial class UserControl2 : System.Web.UI.UserControl
{
    protected Button UserControl2Button1;

    protected void Page_Load(object sender, EventArgs e)
    {

    }

    public event EventHandler BubbleClick;

    protected void OnBubbleClick(EventArgs e)
    {
        if(BubbleClick != null)
        {
            BubbleClick(this, e);
        }
    }      
    protected void UserControl2Button1_Click(object sender, EventArgs e)
    {
        // do some stuff
        OnBubbleClick(e);
    }
}

PageDefault订阅UserControl2的BubbleClick事件处理程序并执行UserControl1.GetLabelText()

public partial class PageDefault : WebPage
{
    UserControl1 userControl1;
    UserControl2 userControl2;

    protected void Page_Load(object sender, EventArgs e)
    {
        UserControl2.BubbleClick += RootBubbleClickHandler;
    }

    protected void RootBubbleClickHandler(object sender, EventArgs e)
    {
        if (sender is UserControl2)
        {
            // subscribe UserControl1 to UserControl2 click event and do something
            userControl1.GetLabelText();
        }

        // check for other controls with "BubbleClicks"         
    }
}

答案 1 :(得分:4)

事件冒泡是ASP.NET WebForms中一个知之甚少的概念。它确实存在(并且被大多数数据绑定控件使用),但经常被误认为是“在用户控件中实现事件”的简单概念(如K Scott Allen所做)。

事件冒泡的核心是事件通过控制层次结构向上移动,直到它被处理或命中根。这允许处理程序代码的一些集中化。它是使用Control.RaiseBubbleEvent和Control.OnBubbleEvent方法实现的。主要用例是具有许多子控件的控件(想想Repeater,ListViews等)。 Repeater不是订阅每个单独的控件,而是在它的OnBubbleEvent中捕获所有控件,并为它们引发一个ItemCommandEvent。

如果你真的想要使用事件冒泡(而不是K. Scott的例子),它看起来像是:

class Page {
    override bool OnBubbleEvent(object sender, EventArgs e) {
         var btn = sender as Button;
         if (btn == null) return false;

         // You may want to do further checking that the source is what you want
         // You could use CommandEventArgs to do this
         this.uc1.GetLabelText();
         return true;
    }
}

事件的顺序如下:

- Button Clicked
- Button RaiseBubbleEvent
- UserControl OnBubbleEvent returns false (default, since you didn't override)
- Page OnBubbleEvent

答案 2 :(得分:0)

您可以尝试在PageDefault.aspx上将UserControl1声明为公共属性(例如“UserControl1”),然后在UserControl2中使用Parent.Page.UserControl1.GetLabelText()吗?