Remove selected text

[George Waters]

Hi guys,

I use SfAutoComplete to search, once the user selects the value, it is added into a SfGrid, so far works perfectly, but I need to clear the text in the autocomplete, I have tried using @bind-Value and setting the variable as empty string, but it doesn't work.

How can remove the selected text (set the input blank) once the value has been selected?

Thanks in advance!

[Keith A Price]

I'd like to know this, too.

[UdhayaKumar Duraisamy]

Hi Slawomir,

We suggest you use the ValueChange event to set the empty value to the autocomplete component. Please refer to the below code snippet for more details.

@using Syncfusion.Blazor.DropDowns

 

<p>Selected value is: @SelectedValue</p>

<p>AutoComplete value is: @AutoVal</p>

 

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

    <AutoCompleteEvents TItem="Country" TValue="string" ValueChange="@ValueChangeHandler" OnValueSelect="@OnValueSelecthandler"></AutoCompleteEvents>

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

</SfAutoComplete>

 

@code {

 

    public string AutoVal;

    public string SelectedValue;

 

    private void ValueChangeHandler(ChangeEventArgs<string, Country> args)

    {

        AutoVal = string.Empty;

    }

    private void OnValueSelecthandler(SelectEventArgs<Country> args)

    {

        SelectedValue = args.ItemData.Name;

    }

    public class Country

    {

        public string Name { get; set; }

 

        public string Code { get; set; }

    }

 

    List<Country> Countries = new List<Country>

{

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

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

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

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

    };

}

Regards,

Udhaya Kumar D

[George Waters]

It works like a charm !!!

Thank you Udhaya.

[UdhayaKumar Duraisamy]

Hi George,

We are glad that your requirement has been fulfilled on your end. We are always happy to assist you.

Regards,

Udhaya Kumar D