Skip to content

Use the popup control's client-side functionality to display the loading panel in a pop-up window when content is loading slowly.

License

Notifications You must be signed in to change notification settings

DevExpress-Examples/asp-net-web-forms-popup-show-the-loading-panel-when-loading-content

Repository files navigation

Popup Control for ASP.NET Web Forms - How to show the loading panel when loading content

This example demonstrates how use the popup control's client-side functionality to display the loading panel in a pop-up window when content is loading slowly.

Loading panel in pop-up window

Overview

The main idea is to call the popup control's client-side GetContentIFrame method to get the control's IFrame. Then use the loading panel's ShowInElement method to display the panel within the IFrame. When content is loaded, hide the loading panel.

<dx:ASPxLoadingPanel ID="lp" runat="server" ClientInstanceName="lp" />
<dx:ASPxPopupControl ID="popup" runat="server" ... >
    <ClientSideEvents Init="OnPopupInit" Shown="OnPopupShown" />
</dx:ASPxPopupControl>
var showPopup = true;
var iframe;
function OnPopupInit (s, e) {
    iframe = popup.GetContentIFrame();
    ASPxClientUtils.AttachEventToElement(iframe, 'load', OnContentLoaded);
}

function OnPopupShown (s, e) {
    if(showPopup)
        lp.ShowInElement(iframe);
}
function OnContentLoaded (e) {
    showPopup = false;
    lp.Hide();
}

Files to Review

Does this example address your development requirements/objectives?

(you will be redirected to DevExpress.com to submit your response)

About

Use the popup control's client-side functionality to display the loading panel in a pop-up window when content is loading slowly.

Topics

Resources

License

Stars

Watchers

Forks

Contributors 3

  •  
  •  
  •