AjaxLoadingPanel w/ascx

[dhuss]

I have a web application with 250+ web (aspx) pages. This application is designed to run in a frameset on a pop-up window (don't ask me why but that is how the contractors coded it. The intent was to protect the user from themselves by removing all IE controls). Each page has a header/footer control (ascx) embedded in their html. I created a header ascx with the radMenu contained in it and all works well. I want to add a loading panel in either the header or footer control so I don't have to update every web page. The loading panel should fire each time a new page is loaded and "spin" until the pages finishes loading. Some pages have datagrids that can take some time to load and I don't want the user to think the app stopped working. The footer ascx is just a very simple control with a single label that is used to display error messages t the user.

My header ascx is as follows:

<%@ Control Language="vb" AutoEventWireup="false" CodeBehind="radSystemHeader.ascx.vb"
    Inherits="HEW.radSystemHeader" %>
<link rel="stylesheet" href="~/StyleSheets/SkinAddStyles.css" />
<telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
<table cellspacing="0" cellpadding="0" width="100%" border="0">
    <tr>
        <td colspan="2">
            <table cellspacing="0" cellpadding="0" width="100%" align="center" border="1">
                <tbody>
                    <tr>
                        <td width="9%" bgcolor="#ffffff" valign="middle" align="center">
                            <a href="<%=Path%><%=sLink%>">
                                <img height="52" src="<%=Path%>images/Page/logo.jpg" width="70" border="0"></a>
                        </td>
                        <td valign="top" align="left">
                            <table cellspacing="0" cellpadding="0" width="100%" border="0">
                                <tr>
                                    <td width="33%">
                                        <asp:Label ID="lblServiceProvider" runat="server"></asp:Label>
                                    </td>
                                    <td align="center" width="33%">
                                        <asp:Label ID="lblUser" runat="server"></asp:Label>
                                    </td>
                                    <td align="right" width="33%">
                                        <asp:Label ID="lblDate" runat="server"></asp:Label>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="3">
                                        <table width="100%">
                                            <tr>
                                                <td width="10%">
                                                    &nbsp;
                                                </td>
                                                <td align="right" width="35%">
                                                    <asp:Label ID="lblHeaderPatient" runat="server">Patient Name:</asp:Label>
                                                </td>
                                                <td width="10%">
                                                    &nbsp;
                                                </td>
                                                <td align="left" width="35%">
                                                    <asp:Label ID="lblHeaderPatientAcctNo" runat="server">Account Number:</asp:Label>
                                                </td>
                                                <td width="10%">
                                                    &nbsp;
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
                                <tr>
                                    <td valign="bottom" colspan="3">
                                        <telerik:RadMenu ID="radMenu_1" runat="server" Width="100%" Flow="Horizontal" CollapseAnimation-Type="InQuart" >
                                        </telerik:RadMenu>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </tbody>
            </table>
        </td>
    </tr>
</table>
<input id="txtVisibleText" type="hidden" value="visible" name="txtVisibleText" runat="server" />

The radMenu is loaded dynamically from a datatable based on user security. The radMenu.skin and labels (ones without any text) are set dynamically as well. I have worked my way through 35 forum pages using the search "loadingpanel". I have tried the majority of examples and none work. Does anybody have any suggestions?

[Sebastian]

Hello dhuss,

You can attach the loading panel to RadAjaxManager settings and display it when the new pages are loaded. The following online demos of the product illustrates its usage:

http://demos.telerik.com/aspnet-ajax/ajax/examples/loadingpanel/loadingimages/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/ajax/examples/loadingpanel/explicitshowhide/defaultcs.aspx

If you host the loading panel inside the user control and trigger ajax request from the main page, you may need to find it inside that user control on the client and show/hide it explicitly as presented on the second example above.

Best regards,
Sebastian
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.