Databinding in Autocomplete - Binding to an object

[Robert]

Hello,

Any help on this would be much appreciated.

Is it possible to do the below? 

TValue is an object that would bind to the viewModel field which is an instance of the the Country object. AutoCompleteFieldSettings takes care of presenting the Text to the user?

```

<div class="col-md-3">

<EjsAutoComplete TValue="Country" @bind-Value="ViewModel.Country" Placeholder="Choose a country" FloatLabelType="@FloatLabelType.Auto" Query="@Query" MinLength="2">

<EjsDataManager AdaptorInstance="@typeof(CustomAdaptorForCountries)" Adaptor="Adaptors.CustomAdaptor"></EjsDataManager>

<AutoCompleteFieldSettings Value="Country" Text="Country.CountryName"></AutoCompleteFieldSettings>

</EjsAutoComplete>

<ValidationMessage style="font-size: small" For="()=>ViewModel.CountryGuid" />

</div>

```

[Berly Christopher]

Hi Robert, 

  

Greetings from Syncfusion support.  

  

Currently the value property accepts only String, Number or Boolean value. So, we are considering this (“Bind the dropdownlist value property as object”) as a feature in our end. This support will be included in any one of our upcoming releases. You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through the below link. 

  

Link: https://www.syncfusion.com/feedback/6812/  

  

Also, our AutoComplete component support, complex type. Please check the below documentation. 

UG Link: https://ej2.syncfusion.com/blazor/documentation/autocomplete/data-source/#array-of-complex-object  

Demo Link: https://blazor.syncfusion.com/demos/AutoComplete/DataBinding?theme=bootstrap4&_ga=2.88998875.1702980552.1582256815-1201479945.1579677299  

  

And you can get the object value from the change event arguments and assign it to the Value property of the AutoComplete component.  

  

Regards, 

Berly B.C 

[Robert]

Thank you for the quick response.

[Berly Christopher]

Hi Robert, 

  

Thanks for your update. Please get back to us if you need further assistance on this. 

  

Regards, 

Berly B.C 

[Daniel Sampedro Bello]

Hi Berly, 

Is there any update in this regard? This is really needed for complex objects, which is very common in any application. Thank you in advance.

[Berly Christopher]

Hi Robert, 

 

Thanks for the update. But, we will consider the feature for the implementation based on the customer request count and priority. So, we will intimate once road map has been prepared for this feature request. Until then, please track the status from the provided feedback link.  

 

Regards, 

Berly B.C 

[richardv]

This feedback link directs to the Angular component - not the Blazor component?

[Jaap van Vliet]

Hi Robert, 

  

Greetings from Syncfusion support.  

  

Currently the value property accepts only String, Number or Boolean value. So, we are considering this (“Bind the dropdownlist value property as object”) as a feature in our end. This support will be included in any one of our upcoming releases. You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through the below link. 

  

Link: https://www.syncfusion.com/feedback/6812/  

  

Also, our AutoComplete component support, complex type. Please check the below documentation. 

UG Link: https://ej2.syncfusion.com/blazor/documentation/autocomplete/data-source/#array-of-complex-object  

Demo Link: https://blazor.syncfusion.com/demos/AutoComplete/DataBinding?theme=bootstrap4&_ga=2.88998875.1702980552.1582256815-1201479945.1579677299  

  

And you can get the object value from the change event arguments and assign it to the Value property of the AutoComplete component.  

  

Regards, 

Berly B.C 

Hi Berly,

'And you can get the object value from the change event arguments and assign it to the Value property of the AutoComplete component.'

Which property of ChangeEventArgs<string> do I have to use to accomplish this? Also tried to use 

<AutoCompleteEvents ValueChange="valueChange" TValue="AutoCompleteOptie" />

private void valueChange(ChangeEventArgs<AutoCompleteOptie> pArgs)

but then I get a a runtime exception 

syncfusion-blazor.min.js:1 Newtonsoft.Json.JsonSerializationException: Error converting value "Boumare, Maasland, Nederland" to type 'Planning.Shared.Entities.RequestObjecten.AutoCompleteOptie'. Path 'value', line 1, position 1033. ---> System.ArgumentException: Could not cast or convert from System.String to Planning.Shared.Entities.RequestObjecten.AutoCompleteOptie.

  at Newtonsoft.Json.Utilities.ConvertUtils.EnsureTypeAssignable (System.Object value, System.Type initialType, System.Type targetType) <0x64516f0 + 0x000d8> in <filename unknown>:0 

(i'm using a custom adaptor)

Appreciate your help ;) best regards, Jaap

[Berly Christopher]

Hi Richardv, 

  

Please find the feedback link in Blazor platform from below. 

Feedback: https://www.syncfusion.com/feedback/10756/  

  

Regards, 

Berly B.C 

[Berly Christopher]

Hi Jaap, 

  

We have checked the reported issue and we would like to inform you that, if you want to get the value of the AutoComplete component from the change event arguments, then we need to deserialize the item data and take value and text property from the data. You can use it for your application needs.  Kindly refer the below code example. 

  

@using Syncfusion.Blazor.DropDowns 

@using Newtonsoft.Json 

  

    <SfAutoComplete TValue="string" TItem="Countries" Placeholder="e.g. Australia" DataSource="@LocalData"> 

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

        <AutoCompleteEvents TValue="string" ValueChange="onValueChange"></AutoCompleteEvents> 

    </SfAutoComplete> 

 

@code { 

 

    public class Countries 

    { 

        public string Name { get; set; } 

        public string Code { get; set; } 

    } 

 

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

    }; 

    public void onValueChange(ChangeEventArgs<string> args) 

    { 

        var item = JsonConvert.DeserializeObject<Countries>(args.ItemData.ToString()); 

        var value = item.Name; 

    } 

} 

  

Please find the sample from the below link. 

Sample Link: https://www.syncfusion.com/downloads/support/forum/151769/ze/AutoComplete_151769-210979463  

  

Regards, 

Berly B.C