SfAutoComplete - reset after selected

[Volker]

Hi there,

I use your autocomplete component to offer a simple customer search in top navigation.
After selecting an item in the dropdown I redirect the user to the customer target page using NavigationManager.

What I miss is a way to clear the search field after redirection.
The user has to click the X to reset the search field to the placeholder entry.

Tried both @data-binding/String.Empty and .clear(), didn't work.

Any idea?

Cheers,
Volker

Attachment: 20210219_12h05_37_a8162f67.zip

[Ponmani Murugaiyan]

Hi Volker, 

Greetings from Syncfusion support. 

We checked your reported query. You can reset the value of AutoComplete component using @bind-Value property as like below code snippet. Here we have demonstrated by resetting the bind-value variable using button click. Please find the code snippet and sample below. 

<SfAutoComplete @ref="AutoCompleteObj" TValue="string" TItem="Countries" @bind-Value="@AutoVal" Placeholder="e.g. Australia" DataSource="@LocalData"> 

    <AutoCompleteFieldSettings Value="Name"></AutoCompleteFieldSettings> 

</SfAutoComplete> 

 

<button class="e-btn apply-limit" @onclick="@Click">Click to reset value</button> 

 

@code { 

    SfAutoComplete<string, Countries> AutoCompleteObj; 

    public string AutoVal = "Canada"; 

    public void Click(Microsoft.AspNetCore.Components.Web.MouseEventArgs args) 

    { 

        AutoVal = null; 

    } 

    public class Countries 

    { 

        public string Name { get; set; } 

        public string Code { get; set; } 

    } 

 

    List<Countries> LocalData = new List<Countries> { 

        new Countries() { Name = "Australia", Code = "AU" }, 

        new Countries() { Name = "Bermuda", Code = "BM" }, 

        new Countries() { Name = "Canada", Code = "CA" }, 

        new Countries() { Name = "Cameroon", Code = "CM" }, 

        new Countries() { Name = "Denmark", Code = "DK" } 

    }; 

} 

 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Blazor_Dropdown17926542 

 

Kindly check with the above suggestion to achieve your requirement. Please get back us if you need further assistance. 

Regards, 

Ponmani M 

[Volker]

Hi Ponmani,

Thank you, it works!!!

Cheers from Graz/Austria,
Volker

[Sureshkumar P]

Hi Volker, 

 

Thanks for your update. Please get back to us if you need further assistance on this 

 

Regards, 

Sureshkumar P