ModalPopupExtender OK 按钮单击事件未触发？答案

【问题标题】：ModalPopupExtender OK Button click event not firing?ModalPopupExtender OK 按钮单击事件未触发？
【发布时间】：2010-09-13 15:30:36
【问题描述】：

我在 UpdatePanel 中有一个按钮。该按钮被用作 ModalPopupExtender 的 OK 按钮。由于某种原因，按钮单击事件未触发。有任何想法吗？我错过了什么吗？

<asp:updatepanel id="UpdatePanel1" runat="server">
    <ContentTemplate>
        <cc1:ModalPopupExtender ID="ModalDialog" runat="server" 
            TargetControlID="OpenDialogLinkButton"
            PopupControlID="ModalDialogPanel" OkControlID="ModalOKButton"
            BackgroundCssClass="ModalBackground">
        </cc1:ModalPopupExtender>
        <asp:Panel ID="ModalDialogPanel" CssClass="ModalPopup" runat="server">
            ...
            <asp:Button ID="ModalOKButton" runat="server" Text="OK" 
                        onclick="ModalOKButton_Click" />
        </asp:Panel>
    </ContentTemplate>
</asp:updatepanel>

【问题讨论】：

标签： asp.net asp.net-ajax updatepanel modalpopupextender

【解决方案1】：

aspx

<ajax:ModalPopupExtender runat="server" ID="modalPop" 
            PopupControlID="pnlpopup" 
            TargetControlID="btnGo"
              BackgroundCssClass="modalBackground"
             DropShadow="true"
             CancelControlID="btnCancel" X="470" Y="300"   />


//Codebehind    
protected void OkButton_Clicked(object sender, EventArgs e)
    {

        modalPop.Hide();
        //Do something in codebehind
    }

并且不要将确定按钮设置为 OkControlID。

【讨论】：

这可行，但请注意“OkButton_Clicked”需要在弹出按钮的 OnCommand 中，例如：

【解决方案2】：

看起来，用作 ModalPopupExtender 的 OK 或 CANCEL 按钮的按钮不能有点击事件。我通过删除

对此进行了测试

OkControlID="ModalOKButton"

来自 ModalPopupExtender 标记，按钮点击触发。我需要想办法将数据发送到服务器。

【讨论】：

【解决方案3】：

也可能是按钮需要具有 CausesValidation="false"。这对我有用。

【讨论】：

天啊，成功了。我的问题与“确定”按钮无关，但没有提交常规的旧按钮点击。
那么当 CausesValidation 需要为“true”时如何？将其设置为“false”确实解决了一个问题，但它会导致另一个问题......
这对我有用，在我将应用程序从 .NET 2.0 升级到 .NET 4.5 后，我的按钮停止触发。但是有了CausesValidation="false"，它又可以工作了。谢谢！
是的，但您现在必须在服务器上进行手动验证调用。

【解决方案4】：

我只是在寻找解决方案:)

如果您希望该控件触发事件，您似乎无法将 OkControlID 分配给该控件，只需删除此属性即可让一切恢复正常。

我的代码（工作）：

<asp:Panel ID="pnlResetPanelsView" CssClass="modalPopup" runat="server" Style="display:none;">
    <h2>
        Warning</h2>
    <p>
        Do you really want to reset the panels to the default view?</p>
    <div style="text-align: center;">
        <asp:Button ID="btnResetPanelsViewOK" Width="60" runat="server" Text="Yes" 
            CssClass="buttonSuperOfficeLayout" OnClick="btnResetPanelsViewOK_Click" />&nbsp;
        <asp:Button ID="btnResetPanelsViewCancel" Width="60" runat="server" Text="No" CssClass="buttonSuperOfficeLayout" />
    </div>
</asp:Panel>
<ajax:ModalPopupExtender ID="mpeResetPanelsView" runat="server" TargetControlID="btnResetView"
    PopupControlID="pnlResetPanelsView" BackgroundCssClass="modalBackground" DropShadow="true"
    CancelControlID="btnResetPanelsViewCancel" />

【讨论】：

【解决方案5】：

将属性“UseSubmitBehavior=false”放入Button-Control。

【讨论】：

【解决方案6】：

以前的答案都不适合我。我在 OnOkScript 事件上调用了按钮的回发。

<div>
    <cc1:ModalPopupExtender PopupControlID="Panel1" 
         ID="ModalPopupExtender1"
         runat="server" TargetControlID="LinkButton1" OkControlID="Ok" 
         OnOkScript="__doPostBack('Ok','')">
    </cc1:ModalPopupExtender>

    <asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton> 
</div>        


<asp:Panel ID="Panel1" runat="server">
    <asp:Button ID="Ok" runat="server" Text="Ok" onclick="Ok_Click" />            
</asp:Panel>

【讨论】：

如果您从 ModalPopupExtender 中删除 OKControlID，按钮将像往常一样回发。在您的事件中，您可以调用 ModalPopupExtender.Hide() 来隐藏弹出窗口。

【解决方案7】：

我经常使用空白标签作为 TargetControlID。前任。 <asp:Label ID="lblghost" runat="server" Text="" />

我见过两件事导致点击事件不触发：
1.您必须删除 OKControlID（正如其他人提到的）
2. 如果您使用字段验证器，则应在按钮上添加 CausesValidation="false"。

这两种情况对我来说都是一样的。

【讨论】：

【解决方案8】：

我找到了一种无需回发即可验证 modalpopup 的方法。

在 ModalPopupExtender 中，我将 OnOkScript 设置为函数，例如 ValidateBeforePostBack()，然后在函数中为我想要的验证组调用 Page_ClientValidate，进行检查，如果失败，保持 modalpopup 显示。如果通过了，我打电话给__doPostBack。

function ValidateBeforePostBack(){ 
     Page_ClientValidate('MyValidationGroupName'); 
     if (Page_IsValid) { __doPostBack('',''); } 
     else { $find('mpeBehaviourID').show(); } 
}

【讨论】：