Back to Devexpress

Create an ASP.NET Web Forms Dashboard Application

dashboard-115782-get-started-build-web-dashboard-applications-create-an-aspnet-web-forms-dashboard-application.md

latest4.7 KB
Original Source

Create an ASP.NET Web Forms Dashboard Application

  • Apr 07, 2025
  • 4 minutes to read

This tutorial shows how to create the dashboard web application using the ASPxDashboard control.

View Example

Add the Web Dashboard Control

  1. In Visual Studio, create a new project and select ASP.NET Web Application (.NET Framework) on the start page as the project template. Next, select the Empty template and click OK.

  2. Add a new Web Form to the application. To do this, right-click the project in the Solution Explorer and select Add | Web Form.

  3. Drag the ASPxDashboard control from the DX.25.2: Data & Analytics Toolbox tab and drop it onto the page to the <body> tag.

Create Dashboard Storage

  1. Right-click the project in the Solution Explorer and select Add | Add ASP.NET Folder | App_Data from the context menu. Then, add the Dashboards folder inside App_Data.

  2. Click the control’s smart tag and set Dashboard Storage Folder to the following relative path: ~/App_Data/Dashboards.

Supply a Web Dashboard with Data

  1. Right-click the App_Data folder, select Add | Existing Item and locate the nwind.mdb database using the following path:

  2. Specify a connection string to the added database within the project’s Web.config file as shown below.

  3. In the Page_Load method of WebForm1.aspx.cs, pass the ConfigFileConnectionStringsProvider instance as the SetConnectionStringsProvider method’s parameter to allow users to create new data sources based on connection strings from the Web.config file:

Add Required Client Libraries

  1. In the web application’s Web.Config file, go to the DevExpress section and add the “resources” section as shown below.

Create a Dashboard

  1. The designer application is now ready. Build and run the project.

  2. For instructions on how to create your first dashboard in the Web Designer, go to Create a Dashboard using the Web Dashboard.

Switch to Viewer Mode

In Designer mode, the control loads the extensions required to design dashboards. Users can access the Data Source Wizard, preview underlying data, and modify dashboards from storage. Requests from the dashboard backend server can be sent to third-party resources. A user can also switch the control to Viewer mode.

After you created and saved a dashboard, switch your Dashboard Designer application to ViewerOnly mode to prevent users from modifying the dashboard and its data.

  1. In the project, switch to WebForm1.aspx and click the control’s smart tag.

  2. Set the Working Mode option to the ‘ViewerOnly’.

  3. Run the application. The ASPxDashboard control displays the dashboard from ~/App_Data/Dashboards.

Warning

Working mode does not influence server settings. Initially, the server works at the ClientTrustLevel.Full trust level. Verify trust level and specify the actions a client can initiate on the server. See the following topic for details: Working Mode Access Rights.

Next Steps

Create Dashboards on the WebDescribes how to create and configure dashboards in the Web Dashboard control.ASP.NET Web Forms Dashboard ControlShows how to embed the ASPxDashboard control into an ASP.NET Web Forms application. See Also

Web Dashboard Technical Overview

ASP.NET Web Forms Dashboard Control