Skip to main content
All docs
V24.2

DxGrid.CustomizeFilterMenu Event

Allows you to customize column filter menu items.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public Action<GridCustomizeFilterMenuEventArgs> CustomizeFilterMenu { get; set; }

Parameters

Type Description
GridCustomizeFilterMenuEventArgs

An object that contains data for this event.

Remarks

When a user clicks a column filter menu button, the Grid creates a list of default filter items to populate the drop-down window. The CustomizeFilterMenu event fires before the window appears and allows you to customize the list.

Use the DataItems event argument to access the list of filter menu items. Each item contains a unique column value and the corresponding display text.

You can customize, add, or remove items. Note that items cannot store filter criteria as values. To implement complex filter criteria, create a filter menu template. For more information, see the following property description: FilterMenuTemplate.

Run Demo: Column Filter Menu

The following code snippet shows how you can modify text in filter menu items. This example adds IDs to customer names.

<DxGrid Data="@customers" 
        FilterMenuButtonDisplayMode="GridFilterMenuButtonDisplayMode.Always"
        CustomizeFilterMenu="OnCustomizeFilterMenu">
    <Columns>
        <DxGridDataColumn FieldName="ContactName" />
        <DxGridDataColumn FieldName="Company" />
        <DxGridDataColumn FieldName="Country" />
    </Columns>
</DxGrid>

@code {
    DateTime data { get; set; }
    Customer[]? customers;
    protected override async Task OnInitializedAsync() {
        customers = await CustomerData.GetData();
    }
    void OnCustomizeFilterMenu(GridCustomizeFilterMenuEventArgs e) {
        if (e.DataColumn.FieldName == "ContactName") {
            e.DataItems.ForEach(di => {
                int? CustomerID = customers.Where(c => 
                    c.ContactName == di.Value.ToString()).FirstOrDefault()?.ID;
                di.DisplayText = di.DisplayText + " (ID " + CustomerID + ")";
            });
        }
    }
}

Blazor Grid - Customized filter menu items

See Also