plz give me a clear example to perform autocomplete operation to a html textbox and data i.e id and name coming from web-api with the help of ajax calls.
<input type="text" id="txtVendorEmail" data-bind="autoComplete:availableEmails,value:EmailId,optionsText:'EmailName',optionsValue:'EmailvalueId'" />
function EmailEntity(data) {
var self = this;
self.EmailName = ko.observable(data.EMailId);
self.EmailvalueId = ko.observable(data.ContactId);
}
var submissionline = function () {
var self = this;
<pre lang="cs">self.availableEmails = ko.observableArray([]);
self.EmailId = ko.observable("");</pre>
$.ajax({
dataType: "JSON",
Type: "Get",
url: baseUri + 'api/Submissions/?fltid=5.5&ch=a&id=1&recname=' + RecName,
success: function (data) {
self.availableEmails.removeAll();
$.each(data, function (i, obj) {
var c = new EmailEntity(data[i]);
self.availableEmails.push(c);
});
},
error: function (jqXHR, textStatus, errorThrown) {
$.jGrowl("Failed to get Details ." + errorThrown + ". " + "" + JSON.parse(jqXHR.responseText).Message + "." + "Please try again.",
{
theme: 'error'
});
}
});
after this when i run it is showing self.emailid.autocomplete is not a function.
plz help me to solve this!!!!!!!!!!