Use SQL Data Sources (ASP.NET Core Blazor)
- 2 minutes to read
This topic explains how use an SQL data source with Dashboards. The data source content is based on the application’s Business Model.
#Enable SQL Data Sources
To enable SQL data sources in your application, supply the dashboard configurator with a connection strings provider in the MySolution.Blazor.Server\Startup.cs file. Review the following code sample:
// ...
using DevExpress.DashboardAspNetCore;
// ...
public class Startup {
// ...
public void ConfigureServices(IServiceCollection services) {
// ...
services.AddXaf(Configuration, builder => {
builder.UseApplication<MySolutionBlazorApplication>();
builder.Modules
// ...
.AddDashboards(options => {
options.DashboardDataType = typeof(DashboardData);
options.SetupDashboardConfigurator = (dashboardConfigurator, serviceProvider) => {
dashboardConfigurator.SetConnectionStringsProvider(new DashboardConnectionStringsProvider(Configuration));
};
});
// ...
});
// ...
}
}
Use the DashboardConnectionStringsProvider class to create new SQL data sources based on connection strings from the MySolution.Blazor.Server\appsettings.json file.
#Allow Custom SQL Queries
To enable custom SQL queries in your application, follow the steps below:
In the MySolution.Blazor.Server\Startup.cs file, enable custom SQL queries on the server side:
C#// ... .AddDashboards(options => { // ... options.SetupDashboardConfigurator = (dashboardConfigurator, serviceProvider) => { // ... dashboardConfigurator.AllowExecutingCustomSql = true; }; })
In the MySolution.Blazor.Server project, create a custom Razor component named
DashboardSettingsHelper
with the following definition:razor@using DevExpress.DashboardBlazor @ChildContent <DxExtensions> <DxDataSourceWizard EnableCustomSql="true"/> </DxExtensions> @code { [Parameter] public RenderFragment ChildContent { get; set; } public static RenderFragment Create(RenderFragment childContent) => @<DashboardSettingsHelper ChildContent=childContent />; }
This Razor component updates settings of a client-side DxDashboard control to allow end-users to write custom SQL queries.
In the MySolution.Blazor.Server\Controllers folder, create the following Controller:
csusing DevExpress.ExpressApp; using DevExpress.ExpressApp.Dashboards.Blazor.Components; using DevExpress.Persistent.Base; using MySolution.Blazor.Server; public class DashboardCustomSqlQueryController : ObjectViewController<DetailView, IDashboardData> { protected override void OnActivated() { base.OnActivated(); View.CustomizeViewItemControl<BlazorDashboardViewerViewItem>(this, CustomizeDashboardViewerViewItem); } void CustomizeDashboardViewerViewItem(BlazorDashboardViewerViewItem dashboardViewerViewItem) { dashboardViewerViewItem.ComponentModel.ChildContent = DashboardSettingsHelper.Create(dashboardViewerViewItem.ComponentModel.ChildContent); } }
This controller uses the Razor component created in the previous step to customize the client-side DxDashboard control. The code modifies the dashboard’s component model instead of the component itself.
End-users can now write custom SQL queries.