Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

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

C#
[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.

razor
<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