Loading Panel on RadDockLayout

[Matt]

Is it possible to put a loading panel on an entire RadDockLayout?  Right now I am resorting to putting a loading panel on each RadDockZone.  But it would look a lot nicer if I could put one on the Layout instead.  Is there a way?

[Pavlina]

Hi Matt,

I am afraid that the desired functionality could be hardly achieved with RadAjaxManager/RadAjaxPanel control. You could only ajaxify RadDockZone control as shown in the attached project.

I hope this helps.

All the best,
Pavlina
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.

[Ryan]

This is great!  Now, I am looking to show the LoadingPanel not just when a PostBack occurs, but also when RadDocks are moved/expanded/collapsed/closed.  Do you have any suggestions?

I'm currently using the following JavaScript to handle all page requests and place the LoadingPanel on top of the requesting object, but I want the LoadingPanel to be put on top of either all RadDocks, or the entire RadDockZone/RadDockLayout:

<!-- Script for LoadingPanel -->
<script language="javascript" type="text/javascript">
    var loadingPanel = "";
    var pageRequestManager = Sys.WebForms.PageRequestManager.getInstance();
    var postBackElement = "";
    pageRequestManager.add_initializeRequest(initializeRequest);
    pageRequestManager.add_endRequest(endRequest);

    function initializeRequest(sender, eventArgs)
    {
        loadingPanel = $find("<%=lpRadDockLoadingPanel.ClientID%>");
        postBackElement = eventArgs.get_postBackElement().id;
        loadingPanel.show(postBackElement);
    }

    function endRequest(sender, eventArgs)
    {
        loadingPanel = $find("<%=lpRadDockLoadingPanel.ClientID%>");
        loadingPanel.hide(postBackElement);
    }

</script>

By the way, I need this because when the user clicks expand/collapse too quickly, or clicks the close button for different RadDocks too quickly, the RadDocks freak out and stops responding to its click events.

Thank you!

[Ryan]

I figured it out!  I was passing the wrong parameter to the LoadingPanel.show() and LoadingPanel.hide() events.  The following JavaScript worked for me:

<!-- Script for LoadingPanel -->
<script language="javascript" type="text/javascript">
    var objLoadingPanel = "";
    var objPageRequestManager = Sys.WebForms.PageRequestManager.getInstance();
    objPageRequestManager.add_initializeRequest(initializeRequest);
    objPageRequestManager.add_endRequest(endRequest);

    function initializeRequest(sender, eventArgs)
    {
        objLoadingPanel = $find("<%=lpRadDockLoadingPanel.ClientID%>");
        objLoadingPanel.show("<%=rdzLeft.ClientID%>");
        objLoadingPanel.show("<%=rdzRight.ClientID%>");
    }

    function endRequest(sender, eventArgs)
    {
        objLoadingPanel = $find("<%=lpRadDockLoadingPanel.ClientID%>");
        objLoadingPanel.hide("<%=rdzLeft.ClientID%>");
        objLoadingPanel.hide("<%=rdzRight.ClientID%>");
    }
</script>

Thanks for your time.