JQuery UI Autocomplete

I'm not going to go deep into explaining how to use Autocomplete as the full documentation for a custom implementation can be found here and for the most part, it works.

The simple trick is to replace .autocomplete("instance") with .data("uiAutocomplete"), though depending on the version, you might have to use .data("ui-autocomplete") instead.

And that's it, simple enough, but it works. Just make sure to check that your code matches the array of objects that you're pulling the items from.

Full example below:

$(".autocomplete").autocomplete({
minLength: 0,
source: response.cities,
focus: function (event, ui) {
$(".autocomplete").val(ui.item.Label);
return false;
},
select: function (event, ui) {
$(".autocomplete").val(ui.item.Label);
return false;
}
}).data("uiAutocomplete")._renderItem = function (ul, item) {
return $("<li>")
.append("<a>" + item.Label + "</a>")
.appendTo(ul);
};

Published at

Tags: jQuery,JavaScript

Luke Alderton

Comments

Post a comment
Sit tight...
We're adding your comment.
Thank you.
Your comment has been added.
There's been a problem.
Please try again later.
Share with
Tags
Latest Comments
By Mahmoud Radwan on Xamarin Forms multiple instances of same app open
16 Sep 2019, 21:16 PM
By للل on JQuery Unobtrusive Validation for dynamically created elements
31 Aug 2019, 10:12 AM
By tiky on JQuery Unobtrusive Validation for dynamically created elements
16 Aug 2019, 13:10 PM
By Gerry on Replacing the Xamarin Header/Navigation bar with a custom view/template
11 Jul 2019, 17:12 PM
By steve choi on Xamarin Forms multiple instances of same app open
30 Jun 2019, 09:09 AM
By esrgr on JQuery Unobtrusive Validation for dynamically created elements
11 Jun 2019, 06:01 AM
By annualmars on Raspberry Pi - Running Java app on Raspbian
10 May 2019, 15:48 PM
By Shahriar H. Razi on Xamarin Forms - Working with threads
7 May 2019, 09:25 AM
Categories
App Development
Event
Game Development
Mapping
Modelling
Programming
Review
Robotics
Tutorial
Web Development