Manage Dashboard State

The dashboard state describes the result of client actions end-users perform on a dashboard, for example:

API Overview

The DashboardState class represents a dashboard's state on the server side and includes individual dashboard items' states (the DashboardState.Items property) and the selected parameter values (DashboardState.Parameters). On the client side, a dashboard state is a JSON object that stores the same data. The table below lists the main server-side and client-side API members related to obtaining and setting a dashboard state.

API

Server-side

DashboardBuilder.InitialDashboardState

DashboardConfigurator.SetDashboardStateService

Client-side

DashboardControl.getDashboardState

DashboardControl.setDashboardState

DashboardControlOptions.onDashboardStateChanged

To initialize the DashboardState object using a JSON object obtained from the client side, use the DashboardStateExtensions.LoadFromJson extension method. Use DashboardStateExtensions.SaveToJson to save the current DashboardState to JSON.

Include a Dashboard State to URL

You can include a dashboard state in the browsed dashboard's URL to allow end-users to share a dashboard state. To do this, enable the DashboardUrlStateOptionBuilder.IncludeDashboardIdToUrl property. In this case, the resulting link allows end-users to open the dashboard with the specified state. Note that these properties are in effect when the DashboardExtensionSettings.WorkingMode is set to WorkingMode.Viewer or WorkingMode.ViewerOnly.

The code sample below shows how to include a dashboard state to URL.

<div style="position: absolute; left:0;top:0;right:0;bottom:0;">
    @(Html.DevExpress().Dashboard("clientDashboardDesigner1")
        .Width("100%")
        .Height("100%")
        .WorkingMode(WorkingMode.Designer)
        .Extensions(extension => extension.UrlState(state => state.IncludeDashboardStateToUrl(true)))
    )    
</div>
Note

You can also include the selected dashboard's identifier in a URL using the DashboardUrlStateOptionBuilder.IncludeDashboardIdToUrl property.

Example: Specify a Default Dashboard State

The sample illustrates how to specify a dashboard state (such as a master filter or parameter values) in code and how to apply this state when loading a dashboard for the first time. In this example, the DashboardState object defined in the Controller stores the required dashboard state. The MVC approach is used to pass the specified dashboard state to the View's DashboardBuilder.InitialDashboardState property and use this state when loading a dashboard.

@using DevExpress.DashboardWeb
@using DevExpress.AspNetCore
@using DevExpress.DashboardAspNetCore
@using AspNetCoreDashboardState
@using AspNetCoreDashboardState.Models
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers