ModalPopup and UpdateProgress Question

Have you tried? What isn't working?

I wasn't sure how to set it up because the example uses buttons to control the popup.
There are a number of posts in this forum about people using code to show/hide the ModalPopup. Sounds like that might be what you want?
Hi,

If you get the latest release of the Toolkit, we've made it even easier to show/hide theModalPopup form the server. TheModalPopupProperties class now has bothShow() andHide() methods that when called from the server will emit the necessary JavaScript to close the popup.

Thanks,
Ted
Do you mean the July Release?
Hi mdenn,

No, I'm talking aboutrelease 60914 that was pushed out last Friday, 9/15.

Thanks,
Ted
Ok, I didn't try that one yet. I saw it from a rss feed, but I didn't see anything about it on the asp.net site or the atlas site.

I've got the latest Toolkit (from the link in a previous posting) and i've now got Show() and Hide() coming up in intellisense, but its not working. It doesnt throw an exception or anything, it just doesn't show the modal popup.

I've got a panel (Panel1) which is my popup control, a hidden button (btnhidden) which is the target control of the ModalPopupExtender. Any ideas??

 <asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" style="display:none"> <p>Saving Data...</p> <p style="text-align:center;"> <asp:Button ID="OkButton" runat="server" Text="OK"></asp:Button> <asp:Button ID="CancelButton" runat="server" Text="Cancel"></asp:Button> </p> </asp:Panel> <asp:Button ID="btnhidden" Visible="false" runat="server" Text="" /> <atlasToolkit:ModalPopupExtender ID="ModalPopupExtender" runat="server"> <atlasToolkit:ModalPopupProperties TargetControlID="btnhidden" PopupControlID="Panel1" BackgroundCssClass="modalBackground" DropShadow="true" OkControlID="OkButton" CancelControlID="CancelButton" /> </atlasToolkit:ModalPopupExtender>

protected void btnSaveMain_Click(object sender, EventArgs e){ ModalPopupProperties popup = ModalPopupExtender.GetTargetProperties(btnhidden);if (popup !=null) popup.Show();}

I'm trying to get a modal popup to appear while an update panel is updating (saving stuff to a database), if there's an easier way please let me know!

Hi bradleyuk,

Could you give us a version of your sample that includes where theUpdatePanel is because I imagine that's the culprit.

Thanks,
Ted

Hi Ted,

I beleive I am having a similar issue using the new Control Toolkit build. I want to have a button open the modal dialogue aftersome server side processing hascompleted. I have adopted the approach of having a hidden button as the TargetControl and another button using the .Show() method to open the dialogue once the sever side event handling is completed. I wasnt sure whether to wrap the 'real' button with an update panel or not so I did just in case. Here is my current markup and code: Nothnig occurs when .Show() is called.

<atlas:UpdatePanel ID="up1" runat="server"><ContentTemplate><asp:LinkButton ID="subscripLink" runat="server" OnClick="subscripLink_Click"></asp:LinkButton></ContentTemplate></atlas:UpdatePanel>

 
<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server"> <cc1:ModalPopupProperties BackgroundCssClass="modalBackground" CancelControlID="noSubscribe" PopupControlID="subscripPanel" TargetControlID="hiddenButton"></cc1:ModalPopupProperties></cc1:ModalPopupExtender>
 

protected void subscripLink_Click(object sender, EventArgs e) {//processing..... ModalPopupExtender1.TargetProperties[0].Show(); }

I have the same problem, when subscripLink is pressed, the event processing occurs but the modal dialog isn't shown....

<%@. Page Language="C#" MasterPageFile="~/Admin/MasterPage.master" AutoEventWireup="true" CodeFile="DatabaseConnections.aspx.cs" Inherits="Admin_Database" Title="Untitled Page" %>
<%@. Register Assembly="Microsoft.Web.Atlas" Namespace="Microsoft.Web.UI" TagPrefix="cc1" %>
<%@. Register Assembly="AtlasControlToolkit" Namespace="AtlasControlToolkit" TagPrefix="atlasToolkit" %><asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"
 <cc1:UpdatePanel ID="UpdatePanel1" runat="server">
 <ContentTemplate
<img src="../App_Themes/Admin/48/Database.png" style="padding-right: 5px; float: left" alt="Database" />
 <asp:Label ID="lTitle" runat="server" CssClass="title" Text="Current Database Settings"></asp:Label><br />
 <br />
 <br />
 <asp:Label ID="lDescription" runat="server" Text="The current database settings are shown below."></asp:Label><br />
 <br /
 <asp:Panel ID="pMainTop" runat="server" CssClass="collapsePanelHeader" Height="20px">
 <div style="cursor: pointer; vertical-align: middle;">
 <table cellpadding="0" cellspacing="0" border="0">
 <tr>
 <td style="width:150px;"><asp:Label ID="lMTitle" runat="server" Text="Client Connection" Font-Bold="true"></asp:Label></td>
 <td style="width:50px;"><asp:Image ID="iMain" runat="server" ImageUrl="~/App_Themes/Admin/16/error.png"/></td>
 <td style="width:300px;"><asp:Label ID="Label5" runat="server">(Show Details...)</asp:Label></td>
 <td style="width:20px;"><asp:Image ID="Image1" runat="server" ImageUrl="~/App_Themes/Admin/images/expand.jpg"/></td>
 </tr>
 </table>
 </div>
 </asp:Panel>
 <asp:Panel ID="pMainBottom" runat="server" CssClass="collapsePanel" Height="0">
 <div class="collapsePaneltable">
 <table cellpadding="0" cellspacing="0" border="0">
 <tr>
 <td style="width: 160px"><asp:Label ID="Label1" runat="server" Text="Server\Instance :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:TextBox ID="lMServer" runat="server" Text="SERVER HERE..." CssClass="textbox"></asp:TextBox></td>
 <td rowspan="8" style="width:200px;">
 <cc1:UpdateProgress ID="UpdateProgress1" runat="server">
 <ProgressTemplate>
 <center>
 <img src="../images/ProgressCircle.gif" alt="Contacting Server" /><br />
 Saving Details...
 </center>
 </ProgressTemplate>
 </cc1:UpdateProgress>
 </td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label2" runat="server" Text="Database :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:TextBox ID="lMDatabase" runat="server" Text="DATABASE HERE..." CssClass="textbox"></asp:TextBox></td>
 </tr>
 <tr>
 <td style="width: 160px; vertical-align:top; padding-top:2px; padding-bottom:2px;"><asp:Label ID="Label4" runat="server" Text="Authentication :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:Panel runat="server" ID="pRadiobuttons">
 <asp:RadioButton ID="rbMIntegrated" runat="server" Text="Integrated" GroupName="mainconnection" OnCheckedChanged="rbMIntegrated_CheckedChanged" /><br />
 <asp:RadioButton ID="rbMSql" runat="server" Text="SQL" Checked="true" GroupName="mainconnection" /></asp:Panel></td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label6" runat="server" Text="Username :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:TextBox ID="lMUsername" runat="server" Text="USERNAME HERE..." CssClass="textbox"></asp:TextBox></td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label8" runat="server" Text="Password :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:TextBox ID="lMPassword" runat="server" Text="PASSWORD HERE..." CssClass="textbox"></asp:TextBox></td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label3" runat="server" Text="Schema Version :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:Label ID="lMSchemaVersion" runat="server" Text="N/A"></asp:Label></td>
 </tr>
 <tr>
 <td style="width: 160px"> </td>
 <td> </td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label10" runat="server" Text="Connection Test :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:Label ID="lMConnectionTest" runat="server" Text="TEST RESULT HERE..."></asp:Label></td>
 </tr>
 <tr>
 <td style="width: 160px"> </td>
 <td> </td>
 </tr>
 <tr>
 <td style="width: 160px"> </td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:Button ID="btnSaveMain" runat="server" Text="Save" OnClick="btnSaveMain_Click"></asp:Button></td>
 </tr>
 </table
 </div>
 </asp:Panel>
 <atlasToolkit:CollapsiblePanelExtender ID="cpe" runat="Server">
 <atlasToolkit:CollapsiblePanelProperties TargetControlID="pMainBottom" ExpandControlID="pMainTop" CollapseControlID="pMainTop" Collapsed="True" CollapsedText="(Show Details...)" ExpandedText="(Hide Details...)" TextLabelID="Label5"
 ImageControlID="Image1" ExpandedImage="~/App_Themes/Admin/images/collapse.jpg" CollapsedImage="~/App_Themes/Admin/images/expand.jpg" SuppressPostBack="true"/>
 </atlasToolkit:CollapsiblePanelExtender
 </ContentTemplate>
 </cc1:UpdatePanel>
 <cc1:UpdatePanel ID="UpdatePanel2" runat="server">
 <ContentTemplate
 <br />
 <asp:Panel ID="pPDATop" runat="server" CssClass="collapsePanelHeader" Height="20px">
 <div style="cursor: pointer; vertical-align: middle;">
 <table cellpadding="0" cellspacing="0" border="0">
 <tr>
 <td style="width:150px;"><asp:Label ID="Label7" runat="server" Text="PDA Connection" Font-Bold="true"></asp:Label></td>
 <td style="width:50px;"><asp:Image ID="iPDA" runat="server" ImageUrl="~/App_Themes/Admin/16/error.png"/></td>
 <td style="width:300px;"><asp:Label ID="Label9" runat="server">(Show Details...)</asp:Label></td>
 <td style="width:20px;"><asp:Image ID="Image2" runat="server" ImageUrl="~/App_Themes/Admin/images/expand.jpg"/></td>
 </tr>
 </table>
 </div>
 </asp:Panel>
 <asp:Panel ID="pPDABottom" runat="server" CssClass="collapsePanel" Height="0">
 <div class="collapsePaneltable">
 <table cellpadding="0" cellspacing="0" border="0">
 <tr>
 <td style="width: 160px"><asp:Label ID="Label11" runat="server" Text="Server\Instance :"></asp:Label></td>
 <td style=''><asp:TextBox ID="lPServer" runat="server" Text="SERVER HERE..." CssClass="textbox"></asp:TextBox></td>
 <td rowspan="8" style="width:200px;">
 <cc1:UpdateProgress ID="UpdateProgress2" runat="server">
 <ProgressTemplate>
 <center>
 <img src="../images/ProgressCircle.gif" alt="Contacting Server" /><br />
 Saving Details...
 </center>
 </ProgressTemplate>
 </cc1:UpdateProgress>
 </td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label13" runat="server" Text="Database :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:TextBox ID="lPDatabase" runat="server" Text="DATABASE HERE..." CssClass="textbox"></asp:TextBox></td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label15" runat="server" Text="Authentication :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:Label ID="lPAuthentication" runat="server" Text="AUTHENTICATION HERE..."></asp:Label></td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label17" runat="server" Text="Username :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:TextBox ID="lPUsername" runat="server" Text="USERNAME HERE..." CssClass="textbox"></asp:TextBox></td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label19" runat="server" Text="Password :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:TextBox ID="lPPassword" runat="server" Text="PASSWORD HERE..." CssClass="textbox"></asp:TextBox></td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label21" runat="server" Text="Schema Version :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:Label ID="lPSchemaVersion" runat="server" Text="N/A"></asp:Label></td>
 </tr>
 <tr>
 <td style="width: 160px"> </td>
 <td style=''> </td>
 </tr>
 <tr>
 <td style="width: 160px"><asp:Label ID="Label23" runat="server" Text="Connection Test :"></asp:Label></td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:Label ID="lPConnectionTest" runat="server" Text="TEST RESULT HERE..."></asp:Label></td>
 </tr>
 <tr>
 <td style="width: 160px"> </td>
 <td> </td>
 </tr>
 <tr>
 <td style="width: 160px"> </td>
 <td style="padding-top:2px; padding-bottom:2px;"><asp:Button ID="btnSavePDA" runat="server" Text="Save" OnClick="btnSavePDA_Click"></asp:Button></td>
 </tr>
 </table
 </div>
 </asp:Panel>
 <atlasToolkit:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="Server">
 <atlasToolkit:CollapsiblePanelProperties TargetControlID="pPDABottom" ExpandControlID="pPDATop" CollapseControlID="pPDATop" Collapsed="True" CollapsedText="(Show Details...)" ExpandedText="(Hide Details...)" TextLabelID="Label9"
 ImageControlID="Image2" ExpandedImage="~/App_Themes/Admin/images/collapse.jpg" CollapsedImage="~/App_Themes/Admin/images/expand.jpg" SuppressPostBack="true"/>
 </atlasToolkit:CollapsiblePanelExtender>
 </ContentTemplate>
 </cc1:UpdatePanel>
 <br /
 <atlasToolkit:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender1" runat="server">
 <atlasToolkit:TextBoxWatermarkProperties TargetControlID="lMServer" WatermarkText="Enter Hostname or IP Address" WatermarkCssClass="watermarked" />
 <atlasToolkit:TextBoxWatermarkProperties TargetControlID="lMDatabase" WatermarkText="Enter Database Name" WatermarkCssClass="watermarked" />
 <atlasToolkit:TextBoxWatermarkProperties TargetControlID="lMUsername" WatermarkText="Enter Username" WatermarkCssClass="watermarked" />
 <atlasToolkit:TextBoxWatermarkProperties TargetControlID="lMPassword" WatermarkText="Enter Password" WatermarkCssClass="watermarked" />
 <atlasToolkit:TextBoxWatermarkProperties TargetControlID="lPServer" WatermarkText="Enter Hostname or IP Address" WatermarkCssClass="watermarked" />
 <atlasToolkit:TextBoxWatermarkProperties TargetControlID="lPDatabase" WatermarkText="Enter Database Name" WatermarkCssClass="watermarked" />
 <atlasToolkit:TextBoxWatermarkProperties TargetControlID="lPUsername" WatermarkText="Enter Username" WatermarkCssClass="watermarked" />
 <atlasToolkit:TextBoxWatermarkProperties TargetControlID="lPPassword" WatermarkText="Enter Password" WatermarkCssClass="watermarked" />
 </atlasToolkit:TextBoxWatermarkExtender
 <br /
 <asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" style="display:none">
 <p>Saving Data...</p>
 <p style="text-align:center;">
 <asp:Button ID="OkButton" runat="server" Text="OK"></asp:Button>
 <asp:Button ID="CancelButton" runat="server" Text="Cancel"></asp:Button>
 </p>
 </asp:Panel
 <asp:Button ID="btnhidden" Visible="false" runat="server" Text="" /
 <atlasToolkit:ModalPopupExtender ID="ModalPopupExtender" runat="server">
 <atlasToolkit:ModalPopupProperties TargetControlID="btnhidden" PopupControlID="Panel1" BackgroundCssClass="modalBackground" DropShadow="true" OkControlID="OkButton" CancelControlID="CancelButton" />
 </atlasToolkit:ModalPopupExtender>
</asp:Content
Code Page:

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
using AtlasControlToolkit;
using System.Xml;
using System.Text;
using System.IO;
public partialclass Admin_Database : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
 {
if (!Page.IsPostBack)
 LoadForm();
 }
private void LoadForm()
 {
string Mserver ="";
string Mdatabase ="";
string Mauthentication ="Standard (SQL)";
string Musername ="";
string Mpassword ="";
string Pserver ="";
string Pdatabase ="";
string Pauthentication ="Standard (SQL)";
string Pusername ="";
string Ppassword ="";
string[] temp;
string[] element;
foreach (ConnectionStringSettings settingin ConfigurationManager.ConnectionStrings)
 {
 temp = setting.ConnectionString.Split(';');
foreach (string sin temp)
 {
 element = s.Split('=');
if (element.Length > 0)
 {
if (element[0].Trim().Equals("Data Source", StringComparison.CurrentCultureIgnoreCase) || element[0].Trim().Equals("Server", StringComparison.CurrentCultureIgnoreCase))
 {
if (setting.Name.Equals("connection")) Mserver = element[1].Trim();
if (setting.Name.Equals("handheld")) Pserver = element[1].Trim();
 }
else if (element[0].Trim().Equals("Initial Catalog", StringComparison.CurrentCultureIgnoreCase) || element[0].Trim().Equals("Database", StringComparison.CurrentCultureIgnoreCase))
 {
if (setting.Name.Equals("connection")) Mdatabase = element[1].Trim();
if (setting.Name.Equals("handheld")) Pdatabase = element[1].Trim();
 }
else if (element[0].Trim().Equals("User ID", StringComparison.CurrentCultureIgnoreCase))
 {
if (setting.Name.Equals("connection")) Musername = element[1].Trim();
if (setting.Name.Equals("handheld")) Pusername = element[1].Trim();
 }
else if (element[0].Trim().Equals("Password", StringComparison.CurrentCultureIgnoreCase))
 {
if (setting.Name.Equals("connection")) Mpassword = element[1].Trim();
if (setting.Name.Equals("handheld")) Ppassword = element[1].Trim();
 }
else if (element[0].Trim().Equals("Integrated Security", StringComparison.CurrentCultureIgnoreCase) || (element[0].Trim().Equals("Trusted_Connection", StringComparison.CurrentCultureIgnoreCase) && element[1].Trim().Equals("true", StringComparison.CurrentCultureIgnoreCase)))
 {
if (setting.Name.Equals("connection")) Mauthentication ="Integrated (Windows)";
if (setting.Name.Equals("handheld")) Pauthentication ="Integrated (Windows)";
 }
 }
 }
//TestConnection(setting.ConnectionString, setting.Name); } rbMIntegrated.Checked = (Mauthentication !="Standard (SQL)");
 rbMSql.Checked = (Mauthentication =="Standard (SQL)");
 lMDatabase.Text = Mdatabase;
 lMPassword.Text = Mpassword;
 lMServer.Text = Mserver;
 lMUsername.Text = Musername;
 lPAuthentication.Text = Pauthentication;
 lPDatabase.Text = Pdatabase;
 lPPassword.Text = Ppassword;
 lPServer.Text = Pserver;
 lPUsername.Text = Pusername;
 }
protected void btnSaveMain_Click(object sender, EventArgs e)
 {
 ModalPopupProperties popup = ModalPopupExtender.GetTargetProperties(btnhidden);
if (popup !=null)
 popup.Show();
//string con = BuildConnectionString(lMServer.Text, lMDatabase.Text, rbMIntegrated.Checked, lMUsername.Text, lMPassword.Text);
 //SetMainConnectionString(Server.MapPath("~/"), con);
 //ConfigurationManager.RefreshSection("connectionStrings");
 //TestConnection(con, "connection"); }protected void btnSavePDA_Click(object sender, EventArgs e)
 {
//string con = BuildConnectionString(lPServer.Text, lPDatabase.Text, false, lPUsername.Text, lPPassword.Text);
 //SetHandheldConnectionString(Server.MapPath("~/"), con);
 //ConfigurationManager.RefreshSection("connectionStrings");
 //TestConnection(con, "handheld"); }protected void rbMIntegrated_CheckedChanged(object sender, EventArgs e)
 {
 lMPassword.Enabled = (!rbMIntegrated.Checked);
 lMUsername.Enabled = (!rbMIntegrated.Checked);
 }
}

 The Script manager is at the top of the masterpage body:

<form id="MasterPageForm" runat="server"> <div id="master_header"> <div id="master_headertop"> <cc1:scriptmanager id="ScriptManager1" runat="server" EnablePartialRendering="True"></cc1:scriptmanager>

Hi a2mawani,

Where is the panel you are extending? Could you post a more complete sample?

Thanks,
Ted
Hi bradleyuk,

Could you possibly shrink your sample down to just the part that's causing you the problem? There's a lot of stuff going on there which contains code I can't run.

Thanks,
Ted
Sorry here is a more complete sample boiled down to the essence of the problem: In this case

RegisterAndLoginHelper.isUserSignedIn(Session) is an example of some server side processing.

Here is the markup:

 <asp:Button ID="realButton" runat="server" Text="real" OnClick="realButton_Click" /> <asp:Button ID="dummyButton" runat="server" Text="dummy" Style="display: none" /> <asp:Panel ID="Panel1" runat="server" Height="50px" Width="125px"> <asp:Button ID="okButton" runat="server" Text="ok" /> <asp:Button ID="cancelButton" runat="server" Text="cancel" /></asp:Panel> <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server"> <cc1:ModalPopupProperties BackgroundCssClass="modalPopup" CancelControlID="cancelButton" OkControlID="okButton" TargetControlID="dummyButton" PopupControlID="Panel1" /> </cc1:ModalPopupExtender>

And the C#

protected void realButton_Click(object sender, EventArgs e) {if (RegisterAndLoginHelper.isUserSignedIn(Session)) { ModalPopupExtender1.TargetProperties[0].Show(); } }