ASPxLoadingPanel Class

An ASPxLoadingPanel control.

Assembly : DevExpress.Web.v25.2.dll

Declaration

C#
VB.NET

csharp

public class ASPxLoadingPanel :
    ASPxWebControl

Public Class ASPxLoadingPanel
    Inherits ASPxWebControl

Remarks

The ASPxLoadingPanel is a panel with text and image. An end user can display and hide it when it is required (for example, while a callback is being processed on the server side).

Create a Loading Panel

Design Time

The ASPxLoadingPanel control is available on the DX.25.2: Navigation & Layout toolbox tab in the Microsoft Visual Studio IDE.

Drag the control onto a form and customize the control’s settings, or paste the control markup in the page’s source code.

ASPX

aspx

<dx:ASPxLoadingPanel ID="ASPxLoadingPanel1" runat="server" Text="Loading...">
</dx:ASPxLoadingPanel>

csharp

using DevExpress.Web;
...
protected void Page_Load(object sender, EventArgs e) {
    ASPxLoadingPanel panel = new ASPxLoadingPanel();
    panel.ID = "ASPxLoadingPanel1";
    form1.Controls.Add(panel);
    panel.Text = "Loading...";
}

Imports DevExpress.Web
...
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
    Dim panel As ASPxLoadingPanel = New ASPxLoadingPanel()
    panel.ID = "ASPxLoadingPanel1"
    form1.Controls.Add(panel)
    panel.Text = "Loading..."
End Sub

Note

DevExpress controls require that you register special modules, handlers, and options in the Web.config file. You can change this file or switch to the Design tab in the Microsoft Visual Studio IDE to automatically update the Web.config file. Note that this information is automatically registered if you use the DevExpress Template Gallery to create a project.

Client-Side API

The ASPxLoadingPanel ‘s client-side API is implemented with JavaScript language and exposed by the ASPxClientLoadingPanel object.

Availability

Available by default.

| |

Client object type

ASPxClientLoadingPanel

| |

Access name

ASPxLoadingPanel.ClientInstanceName

| |

Events

ASPxLoadingPanel.ClientSideEvents

Container Element

You can display the loading panel over the entire page or a specified HTML element (ContainerElementID).

ASPX

aspx

<dx:ASPxLoadingPanel ID="ASPxLoadingPanel1" runat="server"
  ClientInstanceName="lPanel" ContainerElementID="myDiv" Modal="True" ...>
</dx:ASPxLoadingPanel>

<div style="width:500px; height:300px; border: 1px solid red;" id="myDiv">
TEST
</div>
<dx:ASPxButton ID="ASPxButton1" runat="server" Text="ASPxButton" 
    AutoPostBack="False">
    <ClientSideEvents Click="function(s, e) {
          lPanel.Show();
    }" />
</dx:ASPxButton>

You can display the loading panel in modal mode (ASPxLoadingPanel.Modal). In this mode, the loadting panel retains the input focus while active. The user cannot switch focus to the page until the loading panel is hidden by the code. In modal mode, the loading panel covers the entire page behind it (or just the element specified via the ASPxLoadingPanel.ContainerElementID property) with a specific Loading DIV element.

ASPX

aspx

<dx:ASPxLoadingPanel ID="ASPxLoadingPanel1" runat="server"
  ClientInstanceName="lPanel" ContainerElementID="myDiv" Modal="True" ...>
</dx:ASPxLoadingPanel>

<div style="width:500px; height:300px; border: 1px solid red;" id="myDiv">
TEST
</div>
<dx:ASPxButton ID="ASPxButton1" runat="server" Text="ASPxButton" 
    AutoPostBack="False">
    <ClientSideEvents Click="function(s, e) {
          lPanel.Show();
    }" />
</dx:ASPxButton>