Kendo-angular: Drop down with complex data and ngModel requires complex value

[PMoransais]

I am implementing a drop down with complex data and form support

        <kendo-dropdownlist 
                            [data]="countryList"
                            [textField]="'name'"
                            [valueField]="'value'"
                            [(ngModel)]="address.country"
        </kendo-dropdownlist>

My data is a list of name- value objects
[ { name: "United States" value: "US" } ]

I use ngModel with an object address { country: "US" }.

address.country, of course is the value field in my country list.

I specifically want to use the two letter country abbreviation in my data but I would like my users to be able to select the country using "United States in the drop down".

I get an exception:

EXCEPTION: Uncaught (in promise): Error: Expected initial value of type Object. See http://www.telerik.com/kendo-angular-ui/components/dropdowns/dropdownlist/#toc-value-selection
Error: Expected initial value of type Object. See http://www.telerik.com/kendo-angular-ui/components/dropdowns/dropdownlist/#toc-value-selection
at e.verifySettings (https://localhost:44389/lib/@progress/kendo-angular-dropdowns/dist/cdn/js/kendo-angular-dropdowns.js:3:561) [angular]
at e.writeValue (https://localhost:44389/lib/@progress/kendo-angular-dropdowns/dist/cdn/js/kendo-angular-dropdowns.js:2:28498) [angular]

It appears that your drop down list does not bind with the value field of the complex data, but requires the whole object!!!!!!
i.e. instead of binding with 'US' it requires { name: 'United States', value: 'US' }

Your documentation indeed provides an initial value or selection that is the whole object:
{ name: "United States" value: "US" } There is not explanation, no warning.

If this is the case IT IS ABSURD!

The MAIN use case for a drop down in a form is to facilitate data entry and allow the value in the data to be different from the text displayed to the user.

Am I missing something or you indeed published such a component to the unsuspecting masses?

P.S. Please do not request a plunker - you can do your own

P. Moransais

[gyoshev]

This issue tracker is for issues only. Read the value binding help topic to get the necessary information on how to handle this scenario, and open a support ticket if you struggle implementing it in your application.

[PMoransais]

I read the topic you suggest

'If the DropDownList is bound to a dataset of objects, its value will be of the complex type (objects).'

This is worse than a bug! it is horrendous design and thus an issue! Third time your company has been totally unresponsive - $600 totally wasted - you should bump this up to the sales people see if they see a problem.

Sorry for the tone - you made me angry.

[tsvetomir]

I specifically want to use the two letter country abbreviation in my data but I would like my users to be able to select the country using "United States in the drop down".

This is the exact scenario described in Value Binding - Primitive Type Values. See this plunkr for a demo.

[PMoransais]

Thanks @tsvetomir
I am sorry!
I missed/misunderstood the second part of the Primitive section of the doc.
This works perfectly.
One suggestion - others could be confused as I was you could specify at the top of the topic that both complex and simple lists are supported

Thanks

[tsvetomir]

We edited the article, hopefully its more clear now.

Primitive Values from Object Fields

[PMoransais]

Hi Tsvetomir,

It is perfect! AND FAST

Thanks

Philippe Moransais

iBreeder, Inc.

President

1999 N University Drive Suite 406

Coral Springs, FL. 33071

USA

Phone: [phone]

Mobile: [phone]

Skype: PMoransais

[email protected]

From: Tsvetomir Tsonev [mailto:[email protected]]
Sent: Tuesday, April 25, 2017 10:43 AM
To: telerik/kendo-angular [e-mail]
Cc: PMoransais [e-mail]; Author [e-mail]
Subject: Re: [telerik/kendo-angular] Drop down with complex data and ngModel requires complex value (#490)

We edited the article, hopefully its more clear now.

Primitive Values from Object Fields http://www.telerik.com/kendo-angular-ui/components/dropdowns/combobox/value-binding/#toc-primitive-values-from-object-fields

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub https://github.com/telerik/kendo-angular/issues/490#issuecomment-297052890 , or mute the thread https://github.com/notifications/unsubscribe-auth/ASiIawEzlv204ZawI7CemRhP0dhKZeBWks5rzgaLgaJpZM4NGV1R .