Skip to main content
All docs
V24.2

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

DxTreeList.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<TreeListCustomizeFilterMenuEventArgs> CustomizeFilterMenu { get; set; }

#Parameters

Type Description
TreeListCustomizeFilterMenuEventArgs

An object that contains data for this event.

#Remarks

When a user clicks a column filter menu button, the TreeList 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 column value and its 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, refer to the following topic: Custom Filter Menu Content.

The following example adds progress values to task captions:

<DxTreeList Data="Data"
            KeyFieldName="Id"
            ParentKeyFieldName="ParentId"
            FilterMenuButtonDisplayMode="TreeListFilterMenuButtonDisplayMode.Always"
            CustomizeFilterMenu="TreeList_CustomizeFilterMenu"
            CssClass="max-h-480">
    <Columns>
        <DxTreeListDataColumn FieldName="Name" Caption="Task" />
        <DxTreeListDataColumn FieldName="EmployeeName" Caption="Assigned To" TextAlignment="TreeListTextAlignment.Left" />
        <DxTreeListDataColumn FieldName="StartDate" Width="150px" />
        <DxTreeListDataColumn FieldName="DueDate" Width="150px" />
    </Columns>
</DxTreeList>

@code {
    List<EmployeeTask> Data { get; set; }
    void TreeList_CustomizeFilterMenu(TreeListCustomizeFilterMenuEventArgs e) {
        if (e.DataColumn.FieldName == "Name") {
            e.DataItems.ForEach(di => {
                var status = Data.FirstOrDefault(c => c.Name == (string)di.Value)?.Status;
                di.DisplayText += " (" + status + "%)";
            });
        }
    }
}

Blazor TreeList - Customized filter menu items

See Also