data("kendoAutoComplete") returns undefined

[Brian Mains]

Hello,

I'm programmably initializing the auto complete plugin. Because I'm dynamically building the UI on the client, I'm using the client API, not the MVC server wrappers.  I have this function that does the initialization:

function _initKendo(el) {
$(el).attr("disabled", false).kendoAutoComplete({
dataSource: _members,
dataTextField: "Name",
template: '<span data-id="${ data.UserKey }">${ data.Name }</span>',
minLength: 2
});
}

This approach works great.  If in this routine, I were to do:

$(el).data("kendoAutoComplete");

This works great here too.  _members has data as the selection of a member works.  The problem I am having is later on, when I want to extract information about the selected element, data("kendoAutoComplete") returns undefined.  So when the user submits a form, I block submission normally and send a JQuery AJAX request.  I need to grab the user key from the selected item,  To do this, I did:

var auto = $(f).find(".k-autocomplete").data("kendoAutoComplete"); //f is the form that posted back, it has an autocomplete
var item = auto.ul.find(".k-state-selected > span");

This fails because it can't find the plugin, otherwise I believe it would work.  Why can't my code find the plugin using this approach?  I confirmed $(f).find("k-autocomplete") finds the correct element (the input)...

[Dimo]

Hi Brian,

The AutoComplete client object is not attached to the widget wrapper (span.k-autocomplete), but to the element, from which it is created - el in in your case. This is the <input> element inside the <span>.

Regards,
Dimo
the Telerik team