Vue DataGrid - loadPanel

Configures the load panel.

Selector: DxLoadPanel
Type:

LoadPanel

The load panel is displayed while the UI component loads data. It consists of a loading indicator and text, both placed on a pane.

DevExtreme HTML5 JavaScript jQuery Angular Knockout UI component DataGrid TreeList LoadPanel

Since the load panel is, in fact, the DevExtreme LoadPanel UI component, the loadPanel object can contain any properties of this UI component along with properties described here.

See Also

enabled

Enables displaying the load panel automatically.

Type:

Boolean

|

Mode

Default Value: 'auto'

Displaying the load panel is enabled for remote data and disabled for local data by default. Set this property to true to always enable displaying or false to never show the load panel.

height

Specifies the height of the load panel in pixels.

Type:

Number

|

String

Default Value: 90

indicatorSrc

Specifies a URL pointing to an image to be used as a loading indicator.

Selector: indicator-src
Type:

String

Default Value: ''

shading

Specifies whether to shade the UI component when the load panel is shown.

Type:

Boolean

Default Value: false

Enable this property to prevent interaction with the component while loading is in progress.

shadingColor

Specifies the shading color. Applies only if shading is true.

Selector: shading-color
Type:

String

Default Value: ''

This property supports the following colors:

showIndicator

Specifies whether to show the loading indicator.

Selector: show-indicator
Type:

Boolean

Default Value: true

showPane

Specifies whether to show the pane of the load panel.

Selector: show-pane
Type:

Boolean

Default Value: true

text

Specifies text displayed on the load panel.

Type:

String

Default Value: 'Loading...'

NOTE
This property is not supported in Material theme.

width

Specifies the width of the load panel in pixels.

Type:

Number

|

String

Default Value: 200