DxReportDesignerCallbacks Class
Specifies client-side event handler functions for the Report Designer. See DxReportDesignerCallbacks Members for the complete list of events.
Namespace: DevExpress.Blazor.Reporting
Assembly: DevExpress.Blazor.Reporting.v25.2.JSBasedControls.Common.dll
NuGet Package: DevExpress.Blazor.Reporting.JSBasedControls.Common
Declaration
Remarks
The Blazor Report Designer is based on the DevExpress Web Report Designer. The Web Report Designer provides an advanced client-side API that allows you to customize its UI elements and behavior. The DxReportDesignerCallbacks component exposes properties that allow you to specify JavaScript functions as handlers of the client-side events.
Follow these steps to customize the Blazor Report Designer using its client-side API:
Place your JavaScript code in a separate file in the wwwroot folder. Use the window object to create a namespace for your code.
window.DesignerCustomization = { onCustomizeElements: function (s, e) { // Your code here } }Use the DxResourceManager.RegisterScripts() method to register the corresponding script:
<head> @...@ @DxResourceManager.RegisterScripts((config) => config.Register(new DxResource("/customization.js", 900))) @...@ </head>Alternatively, you can add a reference to the script file in the
</body>section of App.razor or Host.cshtml (the file depends on your application type).Specify the JavaScript function names as handlers of the appropriate events in the
DxReportDesignerCallbackscomponent:<DxReportDesigner ReportName="SampleReport" Height="1000px" Width="100%"> <DxReportDesignerCallbacks CustomizeElements="DesignerCustomization.onCustomizeElements" /> </DxReportDesigner>
The following GitHub example project demonstrates various use cases of the Blazor Report Designer client-side events: