The requested page is not available for the requested platform. You are viewing the content for Default platform.

Web Dashboard Technical Overview

  • 5 min to read

The Web Dashboard is a client-side control which communicates with server part using HTTP requests:

  • The client part is the DashboardControl that supplies end-users with a UI for designing a dashboard and interacting with it.
  • The server part handles client data requests and provides various backend capabilities such as accessing data, storing dashboards, etc.

The client communicates with the server part using a RESTful API, allowing to you send multiple data requests simultaneously. For example, if you change the master filter in a dashboard containing several detail items, all these items send their queries to the server. These requests are independently processed on the server side for better performance.

Combined Application

A combined application comprises client and server parts in one application. The following frameworks-based wrappers for the DashboardControl are available when creating a Web Dashboard application:

Another way is to combine the client HTML JavaScript Dashboard Control with the server side in one application:

Note

The ASP.NET WebForms platform has limitations when processing multiple requests. See Server-Side API Overview for details on how to overcome ASPxDashboard control limitations.

Application with Separated Client and Server Parts

Separated client and server parts allow you to use Web Dashboard in the following ways:

  • Create cross-platform Web Dashboard applications.
  • Integrate the Web Dashboard in any place that supports HTTP requests (e.g., see the GitHub Pages Demo).
  • Publish the Web Dashboard as a part of applications based on Angular, Knockout, Vue and similar frameworks.
  • Use the Web Dashboard side-by-side with DevExtreme client-side widgets to create highly responsive web apps.

Separated client and server parts require you to configure one Web Dashboard application as a server and to configure another Web Dashboard application as a client to enable working with the server.

The table below illustrates correlations between server and client. The column headers display platforms you can use as a server, the row headers show available client counterparts.

Client \ Server

ASP.NET HTTP Handlers

ASP.NET MVC

ASP.NET Core

ASP.NET Web Forms (UseDashboardConfigurator = false)1

2

ASP.NET Web Forms (UseDashboardConfigurator = true)

OK

ASP.NET MVC

OK

OK

ASP.NET Core

OK

OK

HTML JS

OK

OK

1 It is a default ASPxDashboardControl mode. See Server-Side API Overview to learn more.

2 In this case, the Web Forms Dashboard sends requests only to its own instance.

Note that you need to set up cross-origin resource sharing (CORS) on your back-end to configure corresponding permissions to access selected resources from a server at a different origin.

Client and Server Specifics

Client-Side Specifics

On the client side, you can use ASPxClientDashboard for Web Forms and MVC wrappers or get access to the HTML JavaScript Dashboard Control directly.

Web Dashboard Client Architecture

Note

The DashboardControl requires various third-party (such as JQuery, JQuery-UI, and Knockout) and DevExtreme libraries. See Required Client Libraries for more information.

Server-Side Specifics

Web Dashboard needs a server-side background to operate with data, store dashboards, etc. You need to configure some specific settings before the first use:

Create a Dashboard Storage

The Web Dashboard requires you to create a special dashboard storage to keep the dashboards. End-users can save new dashboards to this storage and open existing dashboards.

The following storage types are available:

  • In-Memory Storage - An in-memory dashboard storage.
  • File Storage - A dashboard file storage that is used to keep dashboard XML definitions in a file system.
  • Custom Storage - A custom storage (for instance, you can save dashboards to a database).
  • Dashboard Type Storage - A storage for dashboards created at design time within Visual Studio.

See the Preparing a Dashboard Storage topics in the required framework's section (for instance, ASP.NET Web Forms Dashboard Control - Preparing a Dashboard Storage).

Provide Data

Use the following approaches to supply the Web Dashboard with data:

Designer and Viewer Modes

The Web Dashboard can act as the Designer or Viewer. You can set the default working mode on a server side, or switch between the Designer and Viewer with the client-side API.

See the Designer and Viewer Modes topics for a required framework section: