How to: Access the Report Designer Control (Blazor)

• Aug 20, 2024

This example demonstrates how to access the Component Model of the DxReportDesigner component that ASP.NET Core Blazor XAF applications use to display reports.

When a user customize a report at runtime, an ASP.NET Core Blazor application opens a Detail View that contains ReportDesignerViewItem. Follow the steps below to access this View Item and its component:

1. Add the DevExpress.ExpressApp.ReportsV2.Blazor NuGet package to the ASP.NET Core Blazor application project (MySolution.Blazor.Server).
2. Create a View Controller. Set its View property to DetailView and TargetViewId to the View’s identifier. The ReportsBlazorModuleV2.ReportDesignerDetailViewName constant stores this identifier.
3. In the overridden OnActivated method, call the CustomizeViewItemControl<T>(DetailView, Controller, Action<T>) method.
4. Use the ComponentModel property to access properties of the Report Designer.

File:
MySolution.Blazor.Server\Controllers\AccessReportDesignerController.cs

C#

using DevExpress.ExpressApp;
using DevExpress.ExpressApp.ReportsV2.Blazor;
// ...
public class AccessReportDesignerController : ViewController<DetailView> {
    public AccessReportDesignerController() {
        TargetViewId = ReportsBlazorModuleV2.ReportDesignerDetailViewName;
    }
    protected override void OnActivated() {
        base.OnActivated();
        View.CustomizeViewItemControl<ReportDesignerViewItem>(this, CustomizeDesignerViewItem);
    }
    private void CustomizeDesignerViewItem(ReportDesignerViewItem designerDetailItem) {
        // Access the Report Viewer properties
        string reportName = designerDetailItem.ComponentModel.ReportName;
        // ...
    }
}