Configuring the Loading Screen

Summary

  • The Loading Screen is displayed while AdapTable is being initialised
  • This screen is fully configurable to match different requirements

The Loading Screen appears while AdapTable is being initialised and everything is being correctly set up.

Note

  • AdapTable shows the loading screen at the start of Adaptable.init, and hides it when initialisation finishes
  • In other words, it is only removed after state is loaded and AG Grid is ready

There are four options available when setting the Loading Screen.

They are configured using the loadingScreenOptions section of User Interface Options (with these defaults):

PropertyEffectDefault
showLoadingScreenWhen false, no loading screen is renderedtrue
loadingScreenDelayMilliseconds to wait before the dialog appears200
loadingScreenTitleTitle text in the dialog'Initialising Grid'
loadingScreenTextBody text in the dialog'Retrieving your settings and setting up the grid...'

Hint

Set showLoadingScreen to false to never display the Loading Screen

Configuring Loading Screen
Fork
  • loadingScreenTitle and loadingScreenText are set to custom strings
  • loadingScreenDelay is 200 (dialog appears 200ms after init starts)
  • Note: we have configured stateOptions.loadState to wait 2.5 seconds so initialisation takes long enough for the loading screen to remain visible
Try It Out
  • Refresh the demo (or open it in a new tab) to run Adaptable.init again and see the loading dialog
  • Change loadingScreenDelay to 2000 and refresh — the dialog appears later; if init finishes first, you may see nothing (delay is "wait before show", not "minimum display time")

FAQ

Why do I not see the Loading Screen? On a fast machine the loading screen may only flash briefly. To see it reliably, slow down stateOptions.loadState (as in the demo above) or load a large persisted state.