Autocomplete WebApi search/filter

[Kristof]

Hi!

I have an autocomplete component:

<SfAutoComplete @[email protected] TValue="string" TItem="Stock">

     <SfDataManager Url=@("https://localhost:10003/stocks/search?symbol=" + stock.StockId ) [email protected] CrossDomain="true"></SfDataManager>

     <AutoCompleteFieldSettings Value="Id"></AutoCompleteFieldSettings>

</SfAutoComplete>

And i'd like to filter results on the backend based on the current value in the autocomplete. However the bind-ed value (stock.StockId) does not update after each keypress.

How to use WebApi source with backend filtering?

My controller method look like this:

        [HttpGet("search")]

        public async Task<List<Stock>> SearchStocks([FromQuery] string symbol = "")

        {

            var stocks = await StockService.SearchStocks(symbol);

            return stocks.ToDTO(mapper);

        }

Thank you for your help!

[Ponmani Murugaiyan]

Hi Kristóf, 

Greetings from Syncfusion support. 

We have prepared sample as per your requirement for AutoComplete component with WebAPI adaptor. Please find the sample below for reference. 

<SfAutoComplete @ref="autoObjUnidad" TValue="string" TItem="Orders" Placeholder="Select a Employee" AllowFiltering="true" Autofill="true" Query="@RemoteDataUnidad"> 

    <SfDataManager Url="api/Default" Adaptor="Adaptors.WebApiAdaptor" CrossDomain="true"> </SfDataManager> 

       <AutoCompleteFieldSettings Value="CustomerID" Text="CustomerID" /> 

        <AutoCompleteEvents TValue="string" TItem="Orders" Filtering="OnFilterUnidad" /> 

    </SfAutoComplete> 

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

Please get back us if you need further assistance. 

Regards, 

Ponmani M 

[Kristof]

Thank you very much! Your example helped a lot.

[Ponmani Murugaiyan]

Hi Kristóf, 

We are glad to know that the provided solution helps you in achieving your requirement. Please get back us if you need further assistance. 

Regards, 

Ponmani M