Autocomplete with k-ng-model and dataValueField issues

[matt]

Two issues I'm having using the AutoComplete control with Angular...

I'm trying to bind the object/dataItem of the selected item in an autocomplete control to an object on my controller.

<input type="text"  id="acAccount" ng-model="vm.Deal.AccountId" k-ng-model="vm.Account"<br>                                       kendo-auto-complete="acAccount" k-options="vm.accountAutoComplete"  />

It works, although the object vm.Account is always an array with a single item?  How can I make this simply be the selected item?

It works great with the DropDownList.

2nd problem is the value is being bound to the dataTextField, not the dataValueField.
I can look in chrome console and go

$scope.acAccount.options.dataValueField

 and I have the correct field name but when I go

$scope.acAccount.value()

I have the value from the dataTextField.  And that is of course what is stored in vm.Deal.AccountId

Any ideas on either of those.  The array I can work with, although not desirable I can use the on-change/select event and handle that myself...but the value() is a touch strange.  Well, i guess I can also deal with that in the on-change!!!

Still...it'd be nice if someone could see the errors of my ways!

Thx
Steve

[Georgi Krustev]

Hello Steven,

The AutoComplete widget is designed to be a simple (data bound) suggestion box. It supports only a dataTextField option and hence it will not work like DropDownList/ComboBox widget. If you would like to work with whole objects, then there should be no problems. Here is a Dojo demo that demonstrates this case. If you, however, would like to work primitive values, then ComboBox/DropDownList widgets will be more suitable for you. Please check this documentation for more details about primitive values.

Regards,
Georgi Krustev
Telerik

 

 

[ASG]

This seems to be behaving differently in the latest version.  It only ever returns the name now: http://dojo.telerik.com/UJiviPoP

If you swap everything back to 2014.3.1411 then it works fine.

 

 

[Neli]

Please take a look at the following link to our documentation where the change introduced with 2016 Q3 release is explained in more detail:

- https://docs.telerik.com/kendo-ui/controls/editors/autocomplete/how-to/AngularJS/bind-to-ngmodel

I hope this helps.

Regards,

Neli

[matt]

Thanks.  OK, makes sense.

Although the item bound in your demo "country" is also an array with a single item.  Can you select multiple in a autocomplete...well it doesn't matter.

I've actually been looking at the ComboBox and use the dropdown else where...

To be honest the ComboBox seems riddled with oddities.  Even in you demos...but I'll put another post up for that!

[Garret]

I'm with SharpLogic, I don't understand why the the value is an array. In your dojo demo, if a user selects albania, the bound object has value [{"name":"Albania"}]. Shouldn't it just be {"name":"Albania"}. 

The expected behavior when the dataSource is an array of FooBar objects is that selecting one will result in the bound object being an instance of FooBar, not an array with 1 FooBar item in it, right?

Or, as SharpLogic said, I'd love it if someone could point out the errors in my ways.

[Georgi Krustev]

Hello,

The AutoComplete widget allows multiple selection (controlled by placeholder option), hence the returned value should be array of either objects or primitive values. We treat the single selection is a special case of the multiple selection. That is why the returned value is array of single object.

Regards,
Georgi Krustev
Telerik