Connect the ASP.NET Core Dashboard Control to an Entity Framework Data Source

• Dec 24, 2019
• 3 minutes to read

This tutorial shows how to add the DashboardEFDataSource to data source storage and make it available to users. This tutorial uses the SQLite database.

Important

Before you begin, open the NuGet Package Manager and install the Microsoft.EntityFrameworkCore.Sqlite package. This is the SQLite database provider for the Entity Framework Core.

1. In your application, create the Data folder and add the nwind.db database to it from the C:\Users\Public\Documents\DevExpress Demos 19.2\Components\Data folder.

2. Add a new OrdersContext.cs class and create a data context based on the Orders table of the nwind.db database. Define a connection string to the SQLite database by overriding the OnConfiguring method in the constructor.

   using Microsoft.EntityFrameworkCore;
   using System;
   using System.ComponentModel.DataAnnotations;
   
   namespace MvcCoreDashboard {
   
       public partial class OrdersContext : DbContext {
           public OrdersContext() : base() { }
           protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder) {
               base.OnConfiguring(optionsBuilder);
               optionsBuilder.UseSqlite("Data Source=file:Data/nwind.db");
           }
           public virtual DbSet<Order> Orders { get; set; }
       }
       public class Order {
           [Key]
           public int OrderID { get; set; }
           public string CustomerID { get; set; }
           public long? EmployeeID { get; set; }
           public DateTime? OrderDate { get; set; }
           public DateTime? RequiredDate { get; set; }
           public DateTime? ShippedDate { get; set; }
           public long? ShipVia { get; set; }
           public decimal? Freight { get; set; }
           public string ShipName { get; set; }
           public string ShipAddress { get; set; }
           public string ShipCity { get; set; }
           public string ShipRegion { get; set; }
           public string ShipPostalCode { get; set; }
           public string ShipCountry { get; set; }
       }
   }
   

3. In the Startup.cs file, create a public method that returns the configured dashboard’s data source storage (DataSourceInMemoryStorage) and define the Entity Framework Core data source.

   using DevExpress.DashboardCommon;
   using DevExpress.DataAccess.EntityFramework;
   
   public DataSourceInMemoryStorage CreateDataSourceStorage() {
       DataSourceInMemoryStorage dataSourceStorage = new DataSourceInMemoryStorage();
   
       DashboardEFDataSource efDataSource = new DashboardEFDataSource("EF Core Data Source");  
       efDataSource.ConnectionParameters = new EFConnectionParameters(typeof(OrdersContext));
       dataSourceStorage.RegisterDataSource("efDataSource", efDataSource.SaveToXml());     
   
       return dataSourceStorage;
   }
   

4. Call the DashboardConfigurator.SetDataSourceStorage method to configure the data source storage. Use the created CreateDataSourceStorage method as the SetDataSourceStorage parameter.

   using DevExpress.AspNetCore;
   using DevExpress.DashboardAspNetCore;
   using DevExpress.DashboardWeb;
   
   public void ConfigureServices(IServiceCollection services) {            
       services
           .AddMvc()
           .AddDefaultDashboardController(configurator => {
               // ...
               configurator.SetDataSourceStorage(CreateDataSourceStorage());
           });
   }
   

The EF Core Data Source is now available in Web Dashboard.

Users can bind dashboard items to data in the Web Dashboard’s UI. See Bind Dashboard Items to Data in the Web Dashboard’s UI for more information.

Example

The example shows how to make a set of data sources available for users in the Web Dashboard application.

Note

A complete sample project is available on GitHub: How to Register Data Sources for ASP.NET Core Dashboard Control