问题
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("_", "$"), '');
}
回答1:
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();
}
回答2:
I have found a way to by pass this, here is my solution: You have to create a new HiddenField
controller from the server-side in ASP that will be used to store the ID of the ModalPopupExtender
that you want to show after postback, it is set to null if there is no popup to be shown.
<!-- Grid Popup ID: to obtain the grid popup ID from server-side -->
<asp:HiddenField id="gridPopupID" runat="server" value="" />
Next, we need to set the ID to the HiddenField
before we use the save event
// Confirm popup Ok button
function OnOk() {
$('#confirmPopup').hide(); // hides the current confirmation popup
$("#<%= gridPopupID.ClientID %>").val(getID()); // set the ID to the hiddenField.
ClickSaveButton(); // simulates the click of the save button
}
Now, in the code behind, all we need to do is check the value of the HiddenField
text field and we can just do a .Show()
on the correct popup accordingly.
Protected Sub OnSaveAssociation(ByVal sender As Object, ByVal e As EventArgs) Handles butSaveAssociation.Click
' ommited code: save changes to back end
' determine which popup to show
Dim _id As String = gridPopupID.Value
Select Case _id
Case "Popup1"
gridPopup1.Show()
gridPopupID.Value = Nothing
Case "Popup2"
gridPopup2.Show()
gridPopupID.Value = Nothing
End Select
End Sub
回答3:
Use, ModalPopupExtender1.Show() with update panel to avoid the whole page refresh. This has worked perfectly for me.
来源:https://stackoverflow.com/questions/6157168/preventing-modalpopupextender-from-closing-during-after-postback