TypedString in Autocomplete

[Carl]

Using sfautocomplete in blazor with no records template.  Within the no records template I have a button to Add a Record.  The add record button opens a dialog to add the record. 

I want to use the text entered in the autocomplete field to populate a value in the add record dialog.  However, the value is null.  TypedString does contain the value but it is not accessible.  How can I obtain the value typed into the field?

Thanks for your help.

[Berly Christopher]

Hi Carl, 

  

Greetings from Syncfusion support. 

  

We can get the entered text in the AutoComplete component through Text property from the Filtering event arguments. Kindly refer the below code example. 

  

API Link: https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.DropDowns.FilteringEventArgs.html#Syncfusion_Blazor_DropDowns_FilteringEventArgs_Text  

@using Syncfusion.Blazor.DropDowns 

 

<SfAutoComplete TValue="string" TItem="Countries" Placeholder="Select a customer" DataSource="@Country"> 

    <AutoCompleteTemplates TItem="Countries"> 

        <NoRecordsTemplate> 

            <span class='norecord'> NO DATA AVAILABLE</span> 

        </NoRecordsTemplate> 

    </AutoCompleteTemplates> 

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

    <AutoCompleteEvents TValue="string" TItem="Countries" Filtering="onFilter"></AutoCompleteEvents> 

</SfAutoComplete> 

 

@code { 

    public void onFilter(FilteringEventArgs args) 

        { 

        Console.Write(args.Text); 

        } 

    public class EmployeeData 

    { 

        public string Name { get; set; } 

    } 

    public EmployeeData Data = new EmployeeData(); 

 

    public class Countries 

    { 

        public string Name { get; set; } 

 

        public string Code { get; set; } 

    } 

 

    List<Countries> Country = 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" }, 

    }; 

} 

 

  

Screenshot: 

  

 

  

 

  

For your convenience, we have prepared the sample and attached it below. 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Filtering_165429-563981109  

  

Regards, 

Berly B.C 

[Carl]

That works!  Thank you.

[Berly Christopher]

Hi Carl, 

  

Most welcome. Please let us know if you need further assistance on this. 

  

Regards, 

Berly B.C