Jquery Autocomplete Select TypeError: ui.item undefined

Question

I am using jquery ui 1.10.3 and jquery 2.0.3. I am trying to use the autocomplete function to change text of another text box on selecting an option from the suggested optio

Answer 1

turns out I had to change

data("ui-autocomplete" )._renderItemData = function( ul, item ) {

and

.data( "item.autocomplete", item )

to

data("ui-autocomplete" )._renderItem = function( ul, item ) {

and

.data( "item.autocomplete-item", item )

hope this helps anyone who has migration issues with jQuery UI

Answer 2

You should only need to change the one data property:

.data('item.autocomplete')

was deprecated in favour of

.data('ui-autocomplete-item')

As of jQuery UI 1.9 and removed as of jQuery UI 1.10

http://jqueryui.com/upgrade-guide/1.10/#removed-item-autocomplete-data-use-ui-autocomplete-item

Answer 3

I had a similar problem, but this was because the jQuery documentation now shows the usage for jQuery UI 1.10 and our website is still using jQuery UI 1.8.20.

This is what worked for me in the end.

  .data("autocomplete")._renderItem = function (ul, item) {
      return $("<li>")
      .data("item.autocomplete", item)
      .append("<a>" + item.label + "<br><b>" + item.category + "</b></a>").appendTo(ul);
  };