Select event not firing with Angular directives

[Tim]

I can't figure out why the select even is not firing.  Consider the directives below and associated javascript even wiring.   Please advise.

<input id="customerSearch" placeholder="Search Customer"
                           kendo-auto-complete
                           k-suggest="true"
                           k-height="100"
                           k-data-text-field="'name'"
                           k-data-source="customerSearchDataSource"
                           ng-model="search"
                           k-template="'<span>${ data.name }</span>'">

 $(function () {
            $("#customerSearch").kendoAutoComplete({
                select: function (e) {
                    var item = e.item;  // never hits here.
...

                }
            });

[Petyo]

Hello Tim,

The angular directives will initialize the widget - there is no need to do it again with the jQuery plugin syntax. You may use the directive attributes to wire up the event handlers, like our documentation describes. 

Regards,
Petyo
Telerik

 

 

[Tim]

Yes, a bit better now.  However, I don't know how to get a handle to the data item.  It seems you can only get the dataItemTest NOT the dataItem itself using the ng-model.  I need the dataItem to I can get the "id" field not the text that was selected.

$scope.autocomplete_select = function (e) {
                var text = $scope.search; // HOW TO GET THE DATA ITEM ??
            }

[Petyo]

Hi Tim,

the autocomplete does not expose such method by design since it accepts unrestricted user input. The user may enter a text which does not match any of the data items; so implementing features relying on the matching dataItem is not recommended. In case you want to limit your users' choice to a list of pre-defined options, you may use the dropdownlist or the combobox widgets.

Regards,
Petyo
Telerik