How to show complex value [Part 2]

[Amar]

Someone marked my previous thread as resolved even though it isn't, and I can't seem to reply there:
Previous thread

Mohanraj,

your answer does not help me. I need to be able to type in values in a field and search/narrow results based on input, not just have API connected dropdown list, like in your example.

Is there no way to have SelectedTemplate in Autocomplete where I can display whatever I want from the provided context?

[Mohanraj Mathaiyan]

Hi Amar,

We let you know that the SfAutocomplete component does not support ValueTemplate functionalities. So, we suggest using the SfDropDownList component to achieve your requirement.

In the below sample, we have rendered the SfDropDownList component with ValueTemplate and enabled the AllowFiltering property. This property is used to search the results based on typed input. Please find the below code and sample for your reference.

<SfDropDownList TValue="string" TItem="EmployeeData" Placeholder="Select a customer" AllowFiltering="true" Query="@Query">

    <DropDownListTemplates TItem="EmployeeData">

        <ItemTemplate>

            <span><span class='name'>@((context as EmployeeData).FirstName)</span><span class='destination'>@((context as EmployeeData).Designation)</span></span>

        </ItemTemplate>

        <ValueTemplate>

            <span>@((context as EmployeeData).FirstName) - @((context as EmployeeData).Designation)</span>

        </ValueTemplate>

    </DropDownListTemplates>

    <SfDataManager Url="https://ej2services.syncfusion.com/production/web-services/api/Employees" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor" CrossDomain="true"></SfDataManager>

    <DropDownListFieldSettings Text="FirstName" Value="Designation"></DropDownListFieldSettings>

</SfDropDownList>

 

We have attached sample for your reference.

Regards,

Mohanraj M

Attachment: Valuetemplate_23aec47a.zip