Preventing ModalPopupExtender from closing during/after PostBack

JF Beaulieu picture JF Beaulieu · May 27, 2011 · Viewed 22k times · Source

How do I prevent my asp:ModalPopupExtender from closing after or during a postback to the server??

Here is my code:

JAVASCRIPT

// Confirm popup Ok button
function OnOk() {
    $('#confirmPopup').hide();
    ClickSaveButton();      // does a postback
    ShowGridPopup();
}

ASP.NET AJAX

    <asp:ModalPopupExtender BehaviorID="confirmPopup" ID="confirmPopup" runat="server"
        TargetControlID="butConfirm" PopupControlID="ConfirmView" BackgroundCssClass="modalBackground"
        OnOkScript="OnOk();" OnCancelScript="OnCancel();"
        OkControlID="yesButton" CancelControlID="noButton">
    </asp:ModalPopupExtender>

No matter if I call ShowGridPopup() before or after the postback method ClickSaveButton(), the popup still dissapears. How can I prevent this?

EDIT

Here is the code for the ShowGridPopup() and ClickSaveButton()

function ShowGridPopup() {
    if (getID() == "Popup1") {
        ShowGridPopup1();
    } else if (getID() == "Popup2") {
        ShowGridPopup2();
    }
}

function ClickSaveButton() {
    var _id = $('a[id$="butSave"]').attr("ID");
    __doPostBack(_id.replace("_", "$"), '');
}

Answer

mrbengi picture mrbengi · May 25, 2013

You should use UpdatePanel, so the ModalPopupExtender won't be hidden after postback. See this example below :

Aspx:

<body> 
    <form id="form1" runat="server"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
    </asp:ScriptManager> 
    <div> 
        <asp:UpdatePanel ID="udpOutterUpdatePanel" runat="server"> 
             <ContentTemplate> 

                 <asp:Button ID="ButtonShow" runat="server" Text="Show Popup" OnClick="ButtonShow_Click" />                 


                <input id="dummy" type="button" style="display: none" runat="server" /> 
                <ajaxToolkit:ModalPopupExtender runat="server" 
                        ID="mpeThePopup" 
                        TargetControlID="dummy" 
                        PopupControlID="pnlModalPopUpPanel" 
                        BackgroundCssClass="modalBackground"                        
                        DropShadow="true"/>
                 <asp:Panel ID="pnlModalPopUpPanel" runat="server" CssClass="modalPopup"> 
                    <asp:UpdatePanel ID="udpInnerUpdatePanel" runat="Server" UpdateMode="Conditional"> 
                        <ContentTemplate> 
                            Message
                            <asp:Button ID="ButtonClose" runat="server" Text="Close Popup" OnClick="ButtonClose_Click" />                                                                  
                        </ContentTemplate>       
                    </asp:UpdatePanel> 
                 </asp:Panel> 

            </ContentTemplate> 
        </asp:UpdatePanel> 
    </div> 
    </form> 
</body>

Code behind :

    protected void ButtonShow_Click(object sender, EventArgs e)
    {
        //Show ModalPopup               

        mpeThePopup.Show(); 
    }
    protected void ButtonClose_Click(object sender, EventArgs e)
    {
        //Hide ModalPopup

        mpeThePopup.Hide();
    }