0

我有一个启用了过滤器选项的 Telerik 组合框。我添加了用于在文本字段中显示 id 和 value 的 itemtemplate。当用户在下拉列表中输入时,我想使用包含进行过滤。

下面是我试过的代码

<TelerikComboBox Data="@CostCenters"
                     Filterable="true" FilterOperator="@filterOperator"
                     Placeholder="Find cost center by typing"
                     @bind-Value="@SelectedCostCenter1" TextField="CostCenterName" ValueField="CostCenterId">


        <ItemTemplate Context="employeeItem">

            @( (employeeItem as CostCenter).CostCenterId)  @((employeeItem as CostCenter).CostCenterName)
        </ItemTemplate>
    </TelerikComboBox>

但上面的代码只是按名称过滤

4

1 回答 1

1

内置过滤适用于文本(参考),因此如果您想按多个字段过滤,您应该使用OnRead事件并根据需要处理过滤。请务必注意,contains过滤器仅对字符串有意义,因此您不太可能使用它过滤 ID,因为它们通常是数字或 guid。

无论如何,这是一个示例,您可以根据需要过滤数据 - 在此示例中 - 通过 ID 和字符串文本:

@SelectedValue
<br />
<TelerikComboBox Data="@CurrentOptions"
                 OnRead=@ReadItems
                 Filterable="true"
                 Placeholder="Find a car by typing part of its make"
                 @bind-Value="@SelectedValue" ValueField="Id" TextField="Make">
</TelerikComboBox>

@code {
    public int? SelectedValue { get; set; }
    List<Car> AllOptions { get; set; }

    List<Car> CurrentOptions { get; set; }

    protected async Task ReadItems(ComboBoxReadEventArgs args)
    {
        if (args.Request.Filters.Count > 0)
        {
            Telerik.DataSource.FilterDescriptor filter = args.Request.Filters[0] as Telerik.DataSource.FilterDescriptor;
            string userInput = filter.Value.ToString();
            string method = filter.Operator.ToString(); // you can also pass that along if you need to

            CurrentOptions = await GetFilteredData(userInput);
        }
        else
        {
            CurrentOptions = await GetFilteredData(string.Empty);
        }

    }

    // in a real case that would be a service method
    public async Task<List<Car>> GetFilteredData(string filterText)
    {
        //generate the big data source that we want to narrow down for the user
        //in a real case you would probably have fetched it from a database
        if (AllOptions == null)
        {
            AllOptions = new List<Car>
            {
                new Car { Id = 1, Make = "Honda" },
                new Car { Id = 2, Make = "Opel" },
                new Car { Id = 3, Make = "Audi" },
                new Car { Id = 4, Make = "Lancia" },
                new Car { Id = 5, Make = "BMW" },
                new Car { Id = 6, Make = "Mercedes" },
                new Car { Id = 7, Make = "Tesla" },
                new Car { Id = 8, Make = "Vw" },
                new Car { Id = 9, Make = "Alpha Romeo" },
                new Car { Id = 10, Make = "Chevrolet" },
                new Car { Id = 11, Make = "Ford" },
                new Car { Id = 12, Make = "Cadillac" },
                new Car { Id = 13, Make = "Dodge" },
                new Car { Id = 14, Make = "Jeep" },
                new Car { Id = 15, Make = "Chrysler" },
                new Car { Id = 16, Make = "Lincoln" }
            };
        }

        if (string.IsNullOrEmpty(filterText))
        {
            return await Task.FromResult(AllOptions);
        }

        var filteredData = AllOptions.Where(c => c.Make.ToLowerInvariant().Contains(filterText.ToLowerInvariant()));
        // here's an attempt to also filter by ID based on a string, implement this as needed
        int id;
        if (int.TryParse(filterText, out id))
        {
            var filteredById = AllOptions.Where(c => c.Id.ToString().Contains(filterText));
            filteredData = filteredData.Union(filteredById);
        }

        return await Task.FromResult(filteredData.ToList());
    }

    public class Car
    {
        public int Id { get; set; }
        public string Make { get; set; }
    }
}
于 2021-01-25T15:37:43.700 回答