C#动态创建的用户控件按钮单击不工作

我有一个页面（company.aspx），当您单击页面上的按钮时，按钮单击事件（btnShowDeptsUserControl\u click）会动态创建一个用户控件并添加到占位符。页面将在显示用户控件的情况下重新加载。那很好

我遇到的问题是，当我单击用户控件本身上的按钮时，btnEmailDepts_click事件不会被触发，但主页（company.aspx）会被重新加载

我已经读到解决这个问题的一种方法是在Page_Init中创建动态用户控件，但是我正在从主页按钮单击创建用户控件。此外，我并没有像您通常那样在主页的代码隐藏中声明用户控件，而是在其中添加了用户控件的placehoder

我也读到过，你可以在主页上添加一个委托来点击用户控制按钮，但是这个例子似乎有很多必要的代码来完成这么简单的事情，所以我想一定有更好的方法

以下是相关的代码片段：

company.aspx：

    <asp:Button id="btnShowDeptsUserControl" runat="server" OnClick="btnShowDeptsUserControl_Click">Show Depts</asp:Button>

    <asp:PlaceHolder ID="phUserControls" runat="server"></asp:PlaceHolder>

    <asp:Button id="btnShowDeptsUserControl" runat="server" OnClick="btnShowDeptsUserControl_Click">Show Depts</asp:Button>

    <uc1:ucDepartments ID="ucDepartments" runat="server" Visible="False" />

    <asp:Button id="btnShowDeptsUserControl" runat="server" class="btnShowDepts" OnClick="btnShowDeptsUserControl_Click">Show Depts</asp:Button>
    <button class="btnToggleDepts" style="display: none;">Show Depts</button>

   <div id="divShowDepts" style="display: none;">
       <asp:HiddenField runat="server" id="hdnShowDepts"/>
       <uc1:ucDepartments ID="ucDepartments" runat="server" Visible="False" />
   </div>

<script language="javascript" type="text/javascript">
    $(function () {
        toggleDeptsUserControl();
        if ($('#<%=hdnShowDepts.ClientID%>').val() === "show")
            setupDepts();
    });

    function setupDepts() {
        $('.btnShowDeptsUserControl').hide();
        $('.btnToggleDeptsUserControl').show();
        scrollToDepts();
    }

    function scrollToDepts() {
        $('#divShowDepts').toggle(700, function () {
            if ($(this).is(":visible")) {
                $('html, body').animate({ scrollTop: ($(this).offset().top) }, 'slow');
            }
        });
    }

    function toggleDeptsUserControl() {
        $('.btnToggleDeptsUserControl').on('click', function (event) {
            event.preventDefault();
            scrollToDepts();
        });
    }
</script>

ucDepartments.ascx：

    <asp:Button ID="btnEmailDepts" runat="server" Text="Send Email" OnClick="btnEmailDepts_Click" />

    <asp:Button ID="btnEmailDepts" runat="server" Text="Send Email" OnClick="btnEmailDepts_Click" />

如果您阅读，您会注意到：

但是，添加的控件没有赶上回发数据处理。要使添加的控件参与回发数据处理（包括验证），必须在Init事件中而不是在Load事件中添加该控件

您正在

click

事件中添加控件，该事件发生在

init

和

load

事件之后，因此回发将不起作用

---

您可以在

ini

事件中调用

CreateDeptsUserControl

函数，但是您必须在那里检测自己是否单击了

btnShowDeptsUserControl

。这并不难，您需要检查提交的值集合，并查看是否有用于

btnShowDeptsUserControl

的项目，我只是想发布我为实现此功能所做的工作。拉西尔·希兰的回答帮助我找到了这个解决方案。我取消了动态用户控件，使用了aspx中更常见的声明用户控件，但默认情况下将其设置为Visible=“False”

请注意，主页按钮事件为空。还要注意，用户控件页面加载事件为空。所有检查都在用户控件OnInit事件中完成，该事件在每次加载主页时执行

在user control OnInit事件中，我有两个保护条件，检查是什么EVENTTARGET（如果有的话）导致页面/用户控件加载。如果EVENTTARGET（控件ID）是主页按钮的EVENTTARGET，则执行将继续，并将调用LoadSomeData（），并将用户控件Visible设置为true。否则，如果任一保护条件的计算结果为false，我们将退出，并且用户控件不会加载，因此不会浪费db/服务调用

company.aspx：

    <asp:Button id="btnShowDeptsUserControl" runat="server" OnClick="btnShowDeptsUserControl_Click">Show Depts</asp:Button>

    <asp:PlaceHolder ID="phUserControls" runat="server"></asp:PlaceHolder>

    <asp:Button id="btnShowDeptsUserControl" runat="server" OnClick="btnShowDeptsUserControl_Click">Show Depts</asp:Button>

    <uc1:ucDepartments ID="ucDepartments" runat="server" Visible="False" />

    <asp:Button id="btnShowDeptsUserControl" runat="server" class="btnShowDepts" OnClick="btnShowDeptsUserControl_Click">Show Depts</asp:Button>
    <button class="btnToggleDepts" style="display: none;">Show Depts</button>

   <div id="divShowDepts" style="display: none;">
       <asp:HiddenField runat="server" id="hdnShowDepts"/>
       <uc1:ucDepartments ID="ucDepartments" runat="server" Visible="False" />
   </div>

<script language="javascript" type="text/javascript">
    $(function () {
        toggleDeptsUserControl();
        if ($('#<%=hdnShowDepts.ClientID%>').val() === "show")
            setupDepts();
    });

    function setupDepts() {
        $('.btnShowDeptsUserControl').hide();
        $('.btnToggleDeptsUserControl').show();
        scrollToDepts();
    }

    function scrollToDepts() {
        $('#divShowDepts').toggle(700, function () {
            if ($(this).is(":visible")) {
                $('html, body').animate({ scrollTop: ($(this).offset().top) }, 'slow');
            }
        });
    }

    function toggleDeptsUserControl() {
        $('.btnToggleDeptsUserControl').on('click', function (event) {
            event.preventDefault();
            scrollToDepts();
        });
    }
</script>

ucDepartments.ascx：

    <asp:Button ID="btnEmailDepts" runat="server" Text="Send Email" OnClick="btnEmailDepts_Click" />

    <asp:Button ID="btnEmailDepts" runat="server" Text="Send Email" OnClick="btnEmailDepts_Click" />

变体，包括回发后滚动到用户控件的jquery：

在主页按钮单击事件中，您还可以执行一些操作，例如将隐藏变量设置为可以在主页文档上检查的值，以便执行一些jquery操作，例如，如果用户控件位于页面下方（我在当前任务中实际执行此操作），则将其滚动到视图中

这不仅会在单击主页按钮后将现在加载的用户控件滚动到视图中，还会注意setupDepts（）中的代码。我隐藏了执行回发以加载用户控件的asp按钮，并显示了一个常规html按钮。它们看起来都一样（都说showdepts），但是当单击常规的html按钮时，会触发jquery来切换包含用户控件的div以关闭，再次单击，它将打开，再次单击它将关闭，等等

这是为了在单击主页按钮时只加载一次用户控件（进行一次db/服务调用），然后可以通过随后单击备用按钮来切换显示或隐藏它。这种方法可以用于多个按钮或链接，只要它们都具有相同的类ID。例如，您可能在页面顶部有一个Show Depts按钮/链接，在页面底部有一个Show Depts按钮/链接，我当前的任务就是这样

company.aspx：

    <asp:Button id="btnShowDeptsUserControl" runat="server" OnClick="btnShowDeptsUserControl_Click">Show Depts</asp:Button>

    <asp:PlaceHolder ID="phUserControls" runat="server"></asp:PlaceHolder>

    <asp:Button id="btnShowDeptsUserControl" runat="server" OnClick="btnShowDeptsUserControl_Click">Show Depts</asp:Button>

    <uc1:ucDepartments ID="ucDepartments" runat="server" Visible="False" />

    <asp:Button id="btnShowDeptsUserControl" runat="server" class="btnShowDepts" OnClick="btnShowDeptsUserControl_Click">Show Depts</asp:Button>
    <button class="btnToggleDepts" style="display: none;">Show Depts</button>

   <div id="divShowDepts" style="display: none;">
       <asp:HiddenField runat="server" id="hdnShowDepts"/>
       <uc1:ucDepartments ID="ucDepartments" runat="server" Visible="False" />
   </div>

<script language="javascript" type="text/javascript">
    $(function () {
        toggleDeptsUserControl();
        if ($('#<%=hdnShowDepts.ClientID%>').val() === "show")
            setupDepts();
    });

    function setupDepts() {
        $('.btnShowDeptsUserControl').hide();
        $('.btnToggleDeptsUserControl').show();
        scrollToDepts();
    }

    function scrollToDepts() {
        $('#divShowDepts').toggle(700, function () {
            if ($(this).is(":visible")) {
                $('html, body').animate({ scrollTop: ($(this).offset().top) }, 'slow');
            }
        });
    }

    function toggleDeptsUserControl() {
        $('.btnToggleDeptsUserControl').on('click', function (event) {
            event.preventDefault();
            scrollToDepts();
        });
    }
</script>

---

Racil Hilan：我在主页上添加了一个检查EVENTTARGET的OnInit，如果ID是主页按钮的ID，那么我调用CreateDeptsUserControl方法。这样，该方法将创建usercontrol。但我也有同样的问题，单击usercontrol按钮不会触发按钮事件，而只是重新加载主页。但我认为我们在正确的轨道上。在OnInit中，我想我需要以某种方式连接usercontrol按钮事件？