RadAjaxLoadingPanel is blank

[Brian]

I am trying to use a RadAjaxLoadingPanel to show a loading indicator when my RadGrid is loading additional data in the OnDetailTableBind event.  When the grid is loading additional data, it disappears and no loading indicator appears.  If I don't associate the RadAjaxLoadingPanel with the RadGrid, then the grid just sits there until the load finishes.

Here is the code for my page, with columns and detail tables removed for brevity:

<asp:Content ID="cMain" ContentPlaceHolderID="cphMain" runat="server">
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="rgvCorporateSummary">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="rgvCorporateSummary" LoadingPanelID="rgvCorporateSummaryLoadingPanel" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadAjaxLoadingPanel ID="rgvCorporateSummaryLoadingPanel" runat="server">
    </telerik:RadAjaxLoadingPanel>
    <telerik:RadGrid ID="rgvCorporateSummary" runat="server" AutoGenerateColumns="false" ShowStatusBar="true" ShowFooter="true" Skin="WebBlue"
        OnCustomAggregate="rgvCorporateSummary_CustomAggregate" OnNeedDataSource="rgvCorporateSummary_NeedDataSource"
        OnDetailTableDataBind="rgvCorporateSummary_DetailTableDataBind" OnItemCreated="rgvCorporateSummary_ItemCreated">
        <FooterStyle BackColor="#718CA1" ForeColor="White" />
        <MasterTableView DataKeyNames="LocationID" AllowMultiColumnSorting="True" HorizontalAlign="Right" Width="100%">
</MasterTableView>
    </telerik:RadGrid>
</asp:Content>

The master page for this page includes these lines which are relevant:

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
...
<telerik:RadScriptManager ID="rdScriptManager" runat="server" EnablePartialRendering="true" AsyncPostBackTimeout="3600">
                <Scripts>
                    ...
                </Scripts>
            </telerik:RadScriptManager>

The loading effect seems to work in this demo: http://demos.telerik.com/aspnet-ajax/grid/examples/hierarchy/autogeneratedhierarchy/defaultcs.aspx  but I don't see what I am doing differently that should cause this problem.

Thanks in advance for any help.
     -Brian

[Pavlina]

Hello,

You should set the Skin property of RadAjaxLoadingPanel and the loading panel should appear:

<telerik:RadAjaxLoadingPanel ID="rgvCorporateSummaryLoadingPanel" runat="server" Skin="Vista">
    </telerik:RadAjaxLoadingPanel>

Regards,
Pavlina
the Telerik team

[Brian]

Thanks, that fixed the problem. 

The code for this demo: http://demos.telerik.com/aspnet-ajax/grid/examples/hierarchy/autogeneratedhierarchy/defaultcs.aspx should be updated to include a skin attribute on the RadAjaxLoadingPanel so that the code will work.

[Pavlina]

Hello,

In our live examples skins are set through a global skin manager. That is why the loading panel still shows even though the loading panel markup does not set a skin. But if you copy-paste the markup in a new project where skin manager does not set a valid skin, the loading panel will not show. Therefore you need to set Skin to the loadingpanel to make it working as expected.

Kind regards,
Pavlina
the Telerik team