hello,
I am using the ajaxtoolkit modal popup extender to display to display popup, and also a custom modal popup to display a loading progress modal while running a long running task. here is the code I am using below, the problem I am having is when I try to open a modal popup using an extender it also loads the progress modal in the back ground which is not what I want, also when I clock the main model it leave the loading modal popup open that was opened in the back ground. I need both how can I get both to co-exist?
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PatientForm.aspx.cs" Inherits="AwareDocEduWeb.Tabs.PatientForm" %><%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %><%@ Register Src="~/UserControls/ucYesNoCancel.ascx" TagPrefix="uc1" TagName="YesNoCancel" %><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script><html><head><title> </title><script type="CSharp" runat="server">
private bool _ModalYesNoCancelShown = false;
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
}
else
{
if (ViewState["ShowModelYesNoCancel"] != null)
{
if ((bool)ViewState["ShowModelYesNoCancel"] == true)
{
this.ShowModalYesNoCancel();
}
}
}
}
protected void btnYesNoCancelOk_Click(object sender, EventArgs e)
{
// run any task here if u choose not necessary to repeat the bug.
this.HideModalYesNoCancel();
}
void ShowModalYesNoCancel()
{
if (_ModalYesNoCancelShown)
return;
this.ModalYesNoCancel.Show();
ViewState["ShowModelYesNoCancel"] = true;
_ModalYesNoCancelShown = true;
}
void HideModalYesNoCancel()
{
this.ModalYesNoCancel.Hide();
ViewState["ShowModelYesNoCancel"] = null;
}<script></head><body><form id="form1"><script type="text/javascript">
Sys.Application.add_init(appl_init);
// Use this to display progress loading modal when running long running tasks.
function appl_init() {
var pgRegMgr = Sys.WebForms.PageRequestManager.getInstance();
pgRegMgr.add_beginRequest(BeginHandler);
pgRegMgr.add_endRequest(EndHandler);
}
function BeginHandler() {
beforeAsyncPostBack();
}
function EndHandler() {
afterAsyncPostBack();
}
function beforeAsyncPostBack() {
ShowProgress();
}
function afterAsyncPostBack() {
EnsureHideProgress();
}
function ShowProgress() {
setTimeout(function () {
var modal = $('<div />');
modal.attr('id', 'divModalMask');
modal.attr('style', 'display:block;');
modal.addClass("modal");$('body').append(modal);
var loading = $(".loading");
loading.show();
var top = Math.max($(window).height() / 2 - loading[0].offsetHeight / 2, 0);
var left = Math.max($(window).width() / 2 - loading[0].offsetWidth / 2, 0);
loading.css({ top: top, left: left });
}, 200);
}
function EnsureHideProgress() {
var modal = $("#divModalMask");
modal.remove();
var popup = $('#divPopup');
popup.attr('style', 'display:none;');
}</script><div id="divPopup" class="loading" align="center">
Loading. Please wait.<br /><br /><img src="../images/loading_black.gif" alt="" /></div><div><asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="True"></asp:ScriptManager><asp:UpdatePanel ID="Update1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true"><Triggers></Triggers><ContentTemplate><ajaxToolkit:ModalPopupExtender ID="ModalYesNoCancel" runat="server" TargetControlID="btnYesNoCancelOk" PopupControlID="PanelYesNoCancel" OkControlID="btnYesNoCancelCancel" DropShadow="True"></ajaxToolkit:ModalPopupExtender><asp:Panel ID="PanelYesNoCancel" runat="server" align="center" Style="display: none; border-style: solid; border-width: 2px; border-color: black;" BackColor="White" Height="250" Width="515"><!-- Create User control which will be display within this popup is shown, add a button which runs a long running task and u will see what i mean. --><div style="text-align: left; height: 400px; width: 510px; margin-top: 10px;"><uc1:YesNoCancel runat="server" ID="ucYesNoCancel1" /></div><div style="text-align: center"><asp:Button ID="btnYesNoCancelOk" runat="server" Text="Ok" Visible="true" BackColor="Transparent" ForeColor="Transparent" BorderColor="Transparent" BorderStyle="None" Enabled="false" OnClick="btnYesNoCancelOk_Click" /><asp:Button ID="btnYesNoCancelCancel" runat="server" Text="Cancel" Visible="true" BackColor="Transparent" ForeColor="Transparent" BorderColor="Transparent" BorderStyle="None" Enabled="false" /></div></asp:Panel></ContentTemplate></asp:UpdatePanel></div></form></body></html>