Unplanned
Last Updated: 02 Jun 2025 14:33 by Lukasz
Created by: Lukasz
Comments: 0
Category: AutoComplete
Type: Bug Report
0

The AutoComplete DebounceDelay value is larger and the user is quick to type and blur the component, the dropdown will still open when this is no longer necessary.

A possible workaround is to cancel the Open event if it fires too soon after OnChange (uncomment the yellow line):

<p>Quickly type a number (1 - 24) and blur the component:</p>

<TelerikAutoComplete Data="@ListItems"
                     @bind-Value="@SelectedValue"
                     ValueField="@nameof(ListItem.Text)"
                     DebounceDelay="@AutoCompleteDebounceDelay"
                     OnChange="@OnAutoCompleteChange"
                     OnOpen="@OnAutoCompleteOpen"
                     Width="300px" />

@code {
    private List<ListItem> ListItems { get; set; } = new();

    private string SelectedValue { get; set; } = string.Empty;

    private const int AutoCompleteDebounceDelay = 1000;

    private DateTime LastAutoCompleteOnChange { get; set; } = DateTime.Now;

    private void OnAutoCompleteOpen(AutoCompleteOpenEventArgs args)
    {
        if (DateTime.Now - LastAutoCompleteOnChange < new TimeSpan(0, 0, 0, AutoCompleteDebounceDelay * 2))
        {
            //args.IsCancelled = true;
        }
    }

    private void OnAutoCompleteChange(object currentValue)
    {
        LastAutoCompleteOnChange = DateTime.Now;
    }

    protected override void OnInitialized()
    {
        ListItems = new List<ListItem>();

        for (int i = 1; i <= 24; i++)
        {
            ListItems.Add(new ListItem()
            {
                Id = i,
                Text = $"{i}",
                Category = $"Category {i % 6 + 1}"
            });
        }

        base.OnInitialized();
    }

    public class ListItem
    {
        public int Id { get; set; }
        public string Text { get; set; } = string.Empty;
        public string Category { get; set; } = string.Empty;
    }
}

Completed
Last Updated: 23 May 2025 08:31 by ADMIN
Release 9.0.0
If the filter is quickly cleared - for example, by selecting the entire input and deleting it, or by holding down backspace - the filter remains applied to the component. When the popup is opened again, the data is still filtered even though the input has already been cleared.

https://blazorrepl.telerik.com/czEIRuaU2024KPnL05
Unplanned
Last Updated: 06 Jan 2025 15:14 by Hieu
Created by: Hieu
Comments: 0
Category: AutoComplete
Type: Bug Report
1

The AutoComplete component does not update the category grouping header, even when the data within that group has been removed. As a result, the outdated group header remains visible until you scroll down to another group, at which point the first group header refreshes and disappears as expected.

Repro: REPL link.

Completed
Last Updated: 07 Nov 2023 14:32 by ADMIN
Release 5.0.0 (15 Nov 2023) (R1 PI1)
Created by: Chris
Comments: 0
Category: AutoComplete
Type: Bug Report
1

There is a JavaScript error in telerik-blazor.js when using browser autofill with the AutoComplete and the ComboBox:

Cannot read properties of undefined (reading 'length')

A possible workaround is to use a TextBox or a DropDownList.

Here is a test page:

@using System.ComponentModel.DataAnnotations

<TelerikForm Model="@Employee" Width="300px">
    <FormItems>
        <FormItem>
            <Template>
                <label>
                    First Name
                    <TelerikTextBox AutoComplete="given-name" @bind-Value="@Employee.FirstName" />
                </label>
            </Template>
        </FormItem>
        <FormItem>
            <Template>
                <label>
                    Last Name
                    <TelerikTextBox AutoComplete="family-name" @bind-Value="@Employee.LastName" />
                </label>
            </Template>
        </FormItem>
        <FormItem>
            <Template>
                <label class="k-label k-form-label">State*</label>
                <TelerikAutoComplete Data="@StateList"
                                     ValueField="@nameof(DropDownListModel.DataText)"
                                     @bind-Value="@Employee.StateName"
                                     Placeholder="Enter a State, e.g., Alabama"
                                     OnChange="OnStateSelected">
                </TelerikAutoComplete>
                @*<TelerikDropDownList Data="@StateList"
                                         TextField="@nameof(DropDownListModel.DataText)"
                                         ValueField="@nameof(DropDownListModel.DataText)"
                                         @bind-Value="@Employee.StateName"
                                         DefaultText="Enter a State, e.g., Alabama"
                                         OnChange="OnStateSelected">
                    </TelerikDropDownList>*@
                <TelerikValidationMessage For="@(() => Employee.StateName)"></TelerikValidationMessage>
            </Template>
        </FormItem>
    </FormItems>
</TelerikForm>

@code {
    Person Employee { get; set; } = new Person();

    List<DropDownListModel> StateList { get; set; } = new List<DropDownListModel>() {
        new DropDownListModel() { DataText = "Alabama" },
        new DropDownListModel() { DataText = "Alaska" },
        new DropDownListModel() { DataText = "Texas" },
        new DropDownListModel() { DataText = "New York" },
        new DropDownListModel() { DataText = "Washington" },
        new DropDownListModel() { DataText = "California" },
        new DropDownListModel() { DataText = "Florida" }
    };

    void OnStateSelected(object newValue)
    {
    }

    public class Person
    {
        [Required]
        public string FirstName { get; set; }
        [Required]
        public string LastName { get; set; }
        [Required]
        public string StateName { get; set; }
    }

    public class DropDownListModel
    {
        public string DataText { get; set; }
    }
}

 

Duplicated
Last Updated: 09 Apr 2021 14:42 by René

Since 2.23.0 there is something wrong with the z-index of the TelerikComboBox.

If a TelerikComboBox is used on a TelerikWindow, starting to type opens the dropdown behind the window and thus cannot be seen.

Clicking on the Dropdown Button of the ComboBox, the dropdown is opened and displayed correctly and after clicking on the Dropdown Button once, typing in the text field also displays the dropdown correctly.

It really bothers my users though that they cannot start typing right away so I had to revert to version 2.22.0 which does not have this error.

Note: Since I figured it's some kind of styling problem, I rebuild our custom theme using the ThemeBuilder but the error was still there after that.