Asp.Net UpdateProgress control as re-ueseable

Question

I am using a asp:UpdateProgress control on my page and would like to use the same control on multiple pages but not copy and paste the code. I cannot get it to work by pasting the panel into a user control and dropping the user control on the page. But I am unfamiliar with user controls so hopefully it's something simple.

UserControl .ascx file contents

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="AjaxProgressLoader.ascx.cs" Inherits="MyNamespace.Controls.AjaxProgressLoader" %>
    <asp:UpdateProgress runat="server" ID="PageUpdateProgress">
    <ProgressTemplate>
        <div id="Imgt" style="position: absolute; left: 0; top: 0; width: 100%; height: 100%;"
            align="center" valign="middle" runat="server" class="blur">
            <table width="100%">
                <tr>
                    <td>
                        <img src="/Styles/Images/ajax_loader.gif" style="position: relative; horiz-align: center;
                            vert-align: middle; margin-top: 100px" width="75px" />
                    </td>
                </tr>
                <tr>
                    <td style="color: #FFFFFF">
                        Loading...
                    </td>
                </tr>
            </table>
        </div>
    </ProgressTemplate>
</asp:UpdateProgress>

Main .aspx page

<%@ Register TagPrefix="ajax" TagName="AjaxUpdateProgress" Src="~/Controls/AjaxProgressLoader.ascx" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<asp:ScriptManager ID="uxScriptManager" runat="server"></asp:ScriptManager>
<ajax:AjaxUpdateProgress ></ajax:AjaxUpdateProgress>
<asp:UpdatePanel runat="server" ID="Panel">
<ContentTemplate>
My Content...
</ContentTemplate>
</asp:UpdatePanel>

John John · Accepted Answer · 2012-11-08T21:53:31

Solution: I was missing the AssociatedUpdatePanelId on my user controls progress template. I can just define it as follows and call all my panels 'Panel'.

 <asp:UpdateProgress runat="server" ID="PageUpdateProgress" AssociatedUpdatePanelID="Panel">

Thanks to this link for helping me ASP.NET AJAX UpdateProgress in User Control for UpdatePanel in parent page

Asp.Net UpdateProgress control as re-ueseable

1 Answers