DxReportViewer.OnCustomizeParameters Event

Allows you to modify parameter settings and specify custom editors for report parameters.

Namespace: DevExpress.Blazor.Reporting

Assembly: DevExpress.Blazor.Reporting.v25.2.Viewer.dll

NuGet Package: DevExpress.Blazor.Reporting.Viewer

Declaration

C#

[Parameter]
public EventCallback<ParametersModel> OnCustomizeParameters { get; set; }

VB.NET

<Parameter>
Public Property OnCustomizeParameters As EventCallback(Of ParametersModel)

Parameters

Type	Description
ParametersModel	An object that contains report parameters and allows you to manage them.

Remarks

Handle the OnCustomizeParameters event to modify parameter settings and specify custom parameter editors.

Example: Replace a Standard Parameter Editor with a Custom Template

Important

Customization options described in this example are available to owners of DevExpress ASP.NET & Blazor Subscription, DXperience, or Universal subscription (subscriptions that include DevExpress ASP.NET & Blazor UI Controls). The DevExpress Reporting Subscription does not support UI customization in Report Viewer or End-User Report Designer.

Refer to the following help topic for information on subscription options: Installation - Subscriptions that Include Reporting Components.

1. Implement a custom editor based on the DxSpinEdit<T> component. The following code sample defines a custom editor for integer values in the range 0-10 in the CustomInt.razor file:

   <DxSpinEdit @bind-Value="@EditorValue" 
               MinValue="0" 
               MaxValue="10"/>
   
   @code {
       Int32 EditorValue
       {
           get { return (Int32)Value; }
           set { Value = value; ValueChanged.InvokeAsync(value); }
       }
       [Parameter] public object Value { get; set; }
       [Parameter] public EventCallback<object> ValueChanged { get; set; }
   }
   

2. Handle the OnCustomizeParameters event and specify the CustomInt component as the editor’s template (the ValueTemplate property):

   <DxReportViewer @ref="reportViewer" OnCustomizeParameters="OnCustomizeParameters">
   </DxReportViewer>
   
   @code {
       DxReportViewer reportViewer;
   
       void OnCustomizeParameters(ParametersModel parametersModel)
       {
           foreach (var parameter in parametersModel.VisibleItems)
           {
               if (parameter.Type == typeof(int))
               {
                   parameter.ValueTemplate = GetIntEditorTemplate(parameter);
               }
           }
       }
   
       RenderFragment GetIntEditorTemplate(ParameterModel paramModel)
       {
           return @<CustomInt @bind-value="@paramModel.Value"></CustomInt>;
       }
   }
   

Example: Create a Standalone Parameter Editor

Important

Customization options described in this example are available to owners of DevExpress ASP.NET & Blazor Subscription, DXperience, or Universal subscription (subscriptions that include DevExpress ASP.NET & Blazor UI Controls). The DevExpress Reporting Subscription does not support UI customization in Report Viewer or End-User Report Designer.

Refer to the following help topic for information on subscription options: Installation - Subscriptions that Include Reporting Components.

You can hide the Parameter Panel and define a custom editor to specify parameter values:

The code below does the following:

• Hides the Parameter Panel through the Viewer’s TabPanelModel property.
• Creates a custom component based on DxComboBox to allow users to specify the report parameter value. The OnCustomizeParameters is handled to specify the created editor as the editor for the OrderIdParameter parameter.
• Creates a DxButton that handles user clicks and passes the specified parameter value to the Report Viewer. The OnSubmitParameters() method is triggered to build the report document with a new parameter value.

ReportViewer.razor

@page "/standalonepanel/"

@using DevExpress.Blazor.Reporting
@using DevExpress.XtraReports.UI
@using BlazorCustomization.PredefinedReports
@using DevExpress.Blazor.Reporting.Models
@using DevExpress.Blazor
@using Models

<div class="cw-880">
    <EditForm Model="@OrdersModel"
              OnValidSubmit="@HandleValidSubmit"
              Context="EditFormContext">
        <DataAnnotationsValidator />
        <DxFormLayout CssClass="w-75 parameters-panel-custom">
            <DxFormLayoutItem Caption="Order Id:" ColSpanMd="4">
                <CustomCombobox Model=OrdersModel ParameterModel=ParameterModel />
            </DxFormLayoutItem>
            <DxFormLayoutItem ColSpanMd="1">
                <DxButton SubmitFormOnClick="true"
                          Text="Submit"
                          Title="Press the key to reload the report with the parameters."
                          RenderStyle="ButtonRenderStyle.Secondary" />
            </DxFormLayoutItem>
            <DxFormLayoutItem ColSpanMd="7">
                <ValidationSummary />
            </DxFormLayoutItem>
        </DxFormLayout>
    </EditForm>
</div>

<div style="width: 100%; height: calc(100% - 4rem);">
    <DxReportViewer @ref="reportViewer"
                    OnCustomizeParameters="OnCustomizeParameters"
                    Report="Report" />
</div>

@code {
    DxReportViewer reportViewer;
    XtraReport Report = new TableReport();
    OrdersModel OrdersModel = new OrdersModel();
    ParameterModel ParameterModel { get; set; }

    protected override void OnAfterRender(bool firstRender)
    {
        if (firstRender)
        {
            var parameterTab = reportViewer.TabPanelModel.Tabs
                .Where(Tab => Tab.ContentModel is ParametersModel)
                .FirstOrDefault();
            parameterTab.Visible = false;
            StateHasChanged();
        }
        base.OnAfterRender(firstRender);
    }

    void HandleValidSubmit()
    {
        if (!OrdersModel.OrdersData.Contains(OrdersModel.OrderId))
        {
            OrdersModel.OrdersData.Add(OrdersModel.OrderId);
            OrdersModel.OrdersData.Sort();
        }
        reportViewer.ParametersModel.OnSubmitParameters();
    }

    void OnCustomizeParameters(ParametersModel parameters)
    {
        ParameterModel = parameters.VisibleItems
            .Where(param => param.Name == "OrderIdParameter")
            .FirstOrDefault();
    }
}

CustomCombobox.razor

@using Models
@using DevExpress.Blazor.Reporting.Models

<DxComboBox Data="@Model.OrdersData" AllowUserInput="true" @bind-Value="Model.OrderId" TextChanged=OrdersTextChanged CssClass="cw-400 chi-220"></DxComboBox>

@code {
    [Parameter] public OrdersModel Model { get; set; }
    [Parameter] public ParameterModel ParameterModel { get; set; }

    void OrdersTextChanged(string val)
    {
        try
        {
            int id = Int32.Parse(val);
            Model.OrderId = id;
            ParameterModel.Value = id;
        }
        catch (FormatException)
        {
        }
    }
}