DropDown item selection by typing item value. Without filtering

Radzen.Blazor Components
1

We are moving to Radzen and would like to port our dropdowns with similar behaviour: if I type a letter in the dropdown, it should auto select the best match as I type. Is that possible? Without using a filter.

In the code below if I type 2, it should select the second item. This is how HTML select options behave.

<RadzenDropDown @bind-Value=@value Data=@items Name="DropDownBindValue" />

@code {
    int value = 1;
    IEnumerable<int> items;

    //string value = "1";
    //IEnumerable<string> items;

    protected override async Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();

        items = new List<int>() { 1, 2, 11};
        //items = new List<string>() { "1", "2", "11"};
    }
}
2

At the moment this is not supported however we will check if we can add it in some of our upcoming updates this month.

3

Added to our latest update.

2 Likes
4

Is this still working as expected? I’m working with a dropdown which has a few options like “FIRST”, “SECOND”, and “THIRD”. I’d expect typing ‘T’ would automatically select the best match of ‘THIRD’ however it just selects the first item in the dropdown list.

<RadzenDropDown Data="options" @bind-Value="@value" Name="DropDownBindValue" />

@code {
    private List<string> options = new() { "FIRST", "SECOND", "THIRD" };
}
5

Shortly after the release we realized that this function breaks IQueryable support if bound to plain IEnumerable of primitive values and we’ve decided to enable it only when binding to IEnumerable of objects and TextProperty is defined. For example:

UPDATE: I was able to add support for this without breaking IQueryable support and I’ve just published Radzen.Blazor 8.3.9.