ModalPopupExtender OK Button click event not firing?

Question

I have a Button inside an UpdatePanel. The button is being used as the OK button for a ModalPopupExtender. For some reason, the button click event is not firing. Any ideas? Am I missing something?

<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>

score 53 · Accepted Answer · answered Jul 22 '09 at 17:23

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
    }

And don't set the OK button as OkControlID.

This works but note that the "OkButton_Clicked" needs to be in the popup button's OnCommand like: — jroyce, Oct 24 '18 at 19:52

score 10 · Answer 2 · answered Sep 27 '08 at 01:00

It appears that a button that is used as the OK or CANCEL button for a ModalPopupExtender cannot have a click event. I tested this out by removing the

OkControlID="ModalOKButton"

from the ModalPopupExtender tag, and the button click fires. I'll need to figure out another way to send the data to the server.

score 8 · Answer 3 · answered Jun 10 '09 at 12:18

8

It could also be that the button needs to have CausesValidation="false". That worked for me.

answered Jun 10 '09 at 12:18

Johan Leino

3,473
1
26
27

1

OMG, that worked. My problem had nothing to do with the OK button, but the regular old button click wasn't submitting. – DOK Apr 27 '11 at 18:54
So how about when CausesValidation needs to be "true"? Setting it to "false" does solve one problem but it causes another... – Captain Sensible Sep 09 '11 at 14:43
That worked for me, after I upgraded my application from .NET 2.0 to .NET 4.5, my button stoped firing. But with `CausesValidation="false"` it is working again. Thanks! – Guilherme de Jesus Santos May 29 '15 at 20:42
Yeah but you have to now do manual validation calls on the server. – Fandango68 Jun 09 '16 at 00:58

score 6 · Answer 4 · answered Dec 21 '08 at 00:00

I was just searching for a solution for this :)

it appears that you can't have OkControlID assign to a control if you want to that control fires an event, just removing this property I got everything working again.

my code (working):

<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" />

score 5 · Answer 5 · answered Feb 12 '10 at 15:49

5

Put into the Button-Control the Attribute "UseSubmitBehavior=false".

answered Feb 12 '10 at 15:49

Stefan Weiss

51
1
1

score 2 · Answer 6 · answered Nov 24 '10 at 18:09

I often use a blank label as the TargetControlID. ex. <asp:Label ID="lblghost" runat="server" Text="" />

I've seen two things that cause the click event not fire:
1. you have to remove the OKControlID (as others have mentioned)
2. If you are using field validators you should add CausesValidation="false" on the button.

Both scenarios behaved the same way for me.

Johnno Nolan · Answer 7 · 2009-01-28T15:17:16.960

2

None of the previous answers worked for me. I called the postback of the button on the OnOkScript event.

<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>

edited Jan 28 '09 at 15:17

answered Jan 28 '09 at 11:17

Johnno Nolan

29,228
19
111
160

If you remove OKControlID from your ModalPopupExtender, the button will postback like normal. In your event, you can call ModalPopupExtender.Hide() to hide the popup. – Kyle Trauberman Jan 28 '09 at 19:37

score 1 · Answer 8 · edited Jul 16 '18 at 06:31

I've found a way to validate a modalpopup without a postback.

In the ModalPopupExtender I set the OnOkScript to a function e.g ValidateBeforePostBack(), then in the function I call Page_ClientValidate for the validation group I want, do a check and if it fails, keep the modalpopup showing. If it passes, I call __doPostBack.

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

ModalPopupExtender OK Button click event not firing?

8 Answers8

Linked