TelerikAutoComplete won’t change the visible text, despite changing it in code multiple different ways

by

I am using Telerik UI in a Blazor project. I want the text box emptied when a new page is opened. I have a function in the parent component to accomplish this. However, the text in the autocomplete textbox remains there even when I try to change it. I have tried every function and value that Telerik makes available. Here is the autocomplete code in the parent component:

<TelerikAutoComplete Id="SearchBar"
                 TItem="SearchData"
                 ValueChanged="Items"
                 Filterable=false
                 ValueField="DisplayName"
                 Placeholder="Search here"
                 ClearButton="true"
                 DebounceDelay="300"
                 OnOpen="@(async() => await DisplayChange(true) )"
                 @ref="test">
<AutoCompleteSettings>

The function in the parent component, ResetOnNavigate(), fires when the page is changed exactly as expected. The Telerik text box simply refuses to change the text. This is the code that fires in the parent component:

private async Task ResetOnNavigate()
{
    SearchText = string.Empty;
    //all attemps go here
    await InvokeAsync(StateHasChanged);
}

And here are all the ways I have tried to remove the visible text:

test.TextField = string.Empty;

test.Value = SearchText;

test.Refresh();

_ = test.ValueChanged;

test.InvokeAsync<>();

The TelerikAutoComplete ignores all attempts to change the visible text and continues displaying whatever was entered. Updating the value of a textbox cannot possibly be this complex. At this point I assume there is a bug in the Telerik code, but since it’s complied I can’t do anything about it. How do I fix this?

  • Don’t you need to have a Value property with the search text. e.g. Value=”SearchText” on your TelerikAutoComplete

    – 

  • And what is Items in ValueChanged="Items"?

    – 




  • I tried adding SearchText as Value, it made no difference.

    – 

  • because your ValueChanged is tied to Value, can you share all the relevant code that is being used by TelerikAutoComplete. Even better if you can create a working snippet with your problem here. blazorrepl.telerik.com

    – 




  • I decided early on that since Blazor components were so easy to work with, that I would not use 3rd-party solutions. I now have a library of components that do exactly what I want, and are custom built to how I like to do things. I had to learn a bit of JS, and spent a lot of time learn about inline SVG, but there’s nothing I like less than using someone else’s products and them not working how I expect.

    – 

Leave a Comment