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("_", "$"), '');
}
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();
}