Question

我正在使用VS 2012 / ASP.NET（网络表单）4.5。我有一个带有传统用户控件的页面：

<%@ Page Title="" Language="C#" MasterPageFile="~/ControlCenter/MasterAdmin.master" AutoEventWireup="true" CodeFile="OrderDetail.aspx.cs" Inherits="ControlCenter_OrderDetail" %>

<%@ register src="~/Controls/OrderDetailMenu.ascx" tagprefix="eoi" tagname="OrderDetailMenu" %>

<asp:content ID="OrderDetailHead" ContentPlaceHolderID="head" Runat="Server">
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
<script type="text/javascript" src="../Scripts/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="../Scripts/jquery-ui-1.8.20.js"></script>
</asp:content>
<asp:content ID="OrderDetailBody" ContentPlaceHolderID="BodyContent" Runat="Server">
<table style="width: 100%;">
    <tr>
        <td colspan="4">
            <eoi:orderdetailmenu id="OrderDetailMenu" runat="server" />
        </td>
    </tr>
..............

在控件内部，我使用jQuery对话框来显示嵌套的用户控件：

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="OrderDetailMenu.ascx.cs" Inherits="Controls_OrderDetailMenu" %>
<%@ register src="~/Controls/UserComments.ascx" tagprefix="eoi" tagname="UserComments" %>
<%@ register src="~/Controls/OrderComments.ascx" tagprefix="eoi" tagname="OrderComments" %>

<script type="text/javascript">
$(document).ready(function()
{
    //init dialog
    $("#userCommentsPanel").dialog({
        title: "Add User Comment",
        height: 300,
        width: 700,
        autoOpen: false,
        show: "puff",
        hide: "puff", 
        buttons: [
            {
                text: "Close Window",
                click: function()
                {
                    $(this).dialog("close");
                }
            }
        ]
    });

    //popup link event
    $("#addUserCommentsLink").click(function(e)
    {
        $("#userCommentsPanel").dialog("open");
        e.preventDefault();
        return false;
    });
});
</script>
<table border="0" cellpadding="2" cellspacing="3">
<tr>
    <td>
        <a href="#" id="addUserCommentsLink" name="addUserCommentsLink">
            Add User Comment
        </a>
    </td>
</tr>
</table>
<asp:panel id="userCommentsPanel" clientidmode="Static" runat="server">
<div class="userCommentsPopup">
    <eoi:usercomments id="UserComments" runat="server" />
</div>
</asp:panel>

嵌套控件内部是简单形式，如下所示：

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="UserComments.ascx.cs" Inherits="Controls_UserComments" %>
<table style="width:100%;" id="userCommentsFormTable" runat="server">
<tr>
    <td width="1%">&nbsp;</td>
    <td>&nbsp;</td>
</tr>
<tr>
    <td colspan="2">
        <asp:validationsummary id="userCommentsSummary" runat="server" cssclass="validation" ShowModelStateErrors="true" />
    </td>
</tr>
<tr>
    <td>
        <asp:textbox id="commentsBox" runat="server" columns="80" rows="5" textmode="MultiLine"></asp:textbox>
    </td>
    <td>&nbsp;</td>
</tr>
<tr>
    <td align="right">
        <asp:button id="commentsButton" runat="server" text="Save" onclick="commentsButton_Click" />
    </td>
    <td>&nbsp;</td>
</tr>
</table>

...事件处理程序：

    protected void commentsButton_Click(object sender, EventArgs e)
{
        //this method is never executed. :(
}

Page_Load会触发，但按钮点击事件却没有...根本没有任何反应。这里发生了什么事？断点也不会受到打击。就好像事件什么都不做。我确定它与页面生命周期丑陋有关，但我无法在Googleland找到解决方法。

谢谢！

Answer 1

我终于在这里找到了解决方案：

jQuery UI Dialog(Modal), prevents any postback

在对话框声明之后简单地添加这段神秘的代码：

$("#userCommentsPanel").parent().appendTo(jQuery("form:first"));

......它只是有效。

Click事件不会在嵌套用户控件中触发，也不会调试

1 个答案: