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

[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:

Razor

<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 + "%)";
            });
        }
    }
}

EmployeeTask.cs

using System;
using System.ComponentModel.DataAnnotations;
using BlazorDemo.Data.Annotations;

namespace BlazorDemo.Data {
    public class EmployeeTask {
        public int Id { get; set; }
        public int ParentId { get; set; }

        [Required(ErrorMessage = "The Task field is required")]
        public string Name { get; set; }
        public string EmployeeName { get; set; }

        [DateIsEarlierThan("DueDate")]
        [Range(typeof(DateTime), "01/01/2017", "01/01/2027", ErrorMessage = "{0} must be between {1:d} and {2:d}")]
        public DateTime StartDate { get; set; }

        [Range(typeof(DateTime), "01/01/2017", "01/01/2027", ErrorMessage = "{0} must be between {1:d} and {2:d}")]
        public DateTime DueDate { get; set; }

        public int Priority { get; set; }

        public int Status { get; set; }
        public string Description { get; set; }
        public bool HasChildren { get; set; }

        public bool HasDescription => !string.IsNullOrEmpty(Description);
        public bool IsCompleted => Status == 100;

        public EmployeeTask(
            int id,
            int parentId,
            string name,
            string employeeName,
            string startDate,
            string dueDate,
            int priority,
            int status,
            string description,
            bool hasChildren = false
            ) : this() {
            Id = id;
            ParentId = parentId;
            Name = name;
            EmployeeName = employeeName;
            StartDate = DateTime.Parse(startDate);
            DueDate = DateTime.Parse(dueDate);
            Status = status;
            Priority = priority;
            Description = description;
            HasChildren = hasChildren;
        }

        public EmployeeTask() { }
        public EmployeeTask Clone() {
            return (EmployeeTask)MemberwiseClone();
        }
    }
}