@page
"/"
@using Syncfusion.Blazor.DropDowns
@using Syncfusion.Blazor.Data
<SfAutoComplete @ref="autoObj" TValue="string" TItem="Country" Placeholder="e.g. Australia" @bind-Value="@AutoVal" DataSource="@Countries" Width="300px">
<AutoCompleteFieldSettings Text="Name" Value="Id"></AutoCompleteFieldSettings>
<AutoCompleteEvents TValue="string" TItem="Country" Filtering="OnFilter"></AutoCompleteEvents>
</SfAutoComplete>
@code
{
SfAutoComplete<string, Country>
autoObj;
public string AutoVal = "CA";
public class Country
{
public string Name { get; set; }
public string Id { get; set; }
}
List<Country> Countries = new List<Country>
{
new Country() { Name = "Australia", Id = "AU" },
new Country() { Name = "Bermuda", Id = "BM" },
new Country() { Name = "Canada", Id = "CA" },
new Country() { Name = "Cameroon", Id = "CM" },
};
private async Task
OnFilter(FilteringEventArgs args)
{
//Custom Filtering
args.PreventDefaultAction = true;
var
query = new Query().Where(new WhereFilter() { Field = "Name", Operator = "contains", value = args.Text, IgnoreCase
= true });
query = !string.IsNullOrEmpty(args.Text) ?
query : new Query();
await
autoObj.FilterAsync(Countries, query);
}
}
|