DashboardStateExtensions.LoadFromJson(DashboardState, String) Method

Initializes a DashboardState object using the specified JSON object.

Namespace: DevExpress.DashboardAspNetCore

Assembly: DevExpress.Dashboard.v23.2.AspNetCore.dll

NuGet Package: DevExpress.AspNetCore.Dashboard

Declaration

C#

public static void LoadFromJson(
    this DashboardState dashboardState,
    string json
)

VB.NET

<ExtensionAttribute>
Public Shared Sub LoadFromJson(
    dashboardState As DashboardState,
    json As String
)

Parameters

Name	Type	Description
dashboardState	DashboardState	A DashboardState object to be initialized.
json	String	A String value that specifies the JSON object containing a dashboard state.

Example

The sample illustrates how to save the current ASP.NET Core Dashboard state (such as master filter or parameter values) to cookies on the client side and restore this state on the server side.

View Example: ASP.NET MVC

On the server, create a custom dashboard state service so you can load the dashboard state from the cookies:

using DevExpress.DashboardAspNetCore;
using DevExpress.DashboardCommon;
using DevExpress.DashboardWeb;
using Microsoft.AspNetCore.Http;
using System.Web;
using System.Xml.Linq;

namespace WebDashboardAspNetCore {
    public class CustomDashboardStateService : IDashboardStateService {
        IHttpContextAccessor? contextAccessor;
        public CustomDashboardStateService(IHttpContextAccessor? contextAccessor) {
            this.contextAccessor = contextAccessor;
        }
        public DashboardState? GetState(string dashboardId, XDocument dashboard) {
            var cookie = contextAccessor?.HttpContext?.Request.Cookies["dashboardState"];
            if (cookie != null) {
                DashboardState dashboardState = new DashboardState();
                dashboardState.LoadFromJson(HttpUtility.UrlDecode(cookie));
                return dashboardState;
            } else
                return null;
        }
    }
}

Call the DashboardConfigurator.SetDashboardStateService(IDashboardStateService) method to apply the created dashboard state service:

configurator.SetDashboardStateService(new CustomDashboardStateService(contextAccessor));

Handle the DashboardControlOptions.onBeforeRender event:

<div style="position: absolute; left: 0; top: 0; right: 0; bottom: 0;">
@(Html.DevExpress().Dashboard("dashboardControl1")
    .ControllerName("DefaultDashboard")
    .Width("100%")
    .Height("100%")
    .OnBeforeRender("onBeforeRender")
)
</div>

On the client, the DashboardControlOptions.onDashboardStateChanged event is handled so that the control saves the dashboard state to cookies every time the state changes.

function onBeforeRender(sender) {
    const dashboardControl = sender;
    if (dashboardControl)
        dashboardControl.on('dashboardStateChanged', onDashboardStateChanged);
}

function onDashboardStateChanged(e) {
    // Set the number of days until the cookie should expire (exdays):
    const exdays = 1;
    const date = new Date();
    date.setTime(date.getTime() + (exdays * 24 * 60 * 60 * 1000));
    let expires = "expires=" + date.toUTCString();
    // Get the dashboard state:
    let dState = "dashboardState=" + encodeURIComponent(e.component.getDashboardState()) + ";";
    // Assign the cookie name (dashboardState), the cookie value, and the expires string to document.cookie:
    document.cookie = dState + expires + ";path=" + encodeURIComponent("/");
}