Save and Restore Layout

Loading...

The DevExpress Blazor TreeList allows you to save its layout between individual browser sessions. TreeList layout information includes user-modifiable settings such as column position, sort order/direction, current page number, and filter values.

To persist TreeList layout between sessions, handle the following events:

  • LayoutAutoSaving: Raised when TreeList layout settings change. The event's Layout argument contains a TreeListPersistentLayout object with new layout settings. Save this object to storage (in this demo, we use the browser's local storage). When you need to restore a TreeList layout, retrieve the object from the storage and apply it to the TreeList.
  • LayoutAutoLoading: Raised when the TreeList completes its state initialization (as specified in the markup). To load layout settings from a previously saved TreeListPersistentLayout object, assign it to this event's Layout argument.

You can also call SaveLayout and LoadLayout methods to save and restore a TreeList layout on demand (for example, on a button click).

In this demo, changes that you make will persist after page reload operations. To evaluate our implementation, simply reorder columns, sort data, or apply filters and press the Reload Page button to see whether your changes persist. If you want to reset the layout to its original state, simply click Reset Layout.

Note: Our Blazor TreeList does not save row expansion state.