jquery ui - jQueryUI version 1.10 autocomplete - how to set _renderItem?

Question

Since I switched from jqueryui 1.8.1 to 1.10.x I realised that my custom item renderer doesn't work anymore:

Uncaught TypeError: Cannot set property '_renderItem' of undefined 

What is different in new jqueryui versions?

Here my code:

$("#lexicon-search-input")
        .autocomplete({
        ...
        }).data("autocomplete")._renderItem = customItemRenderer;

This was working on jqueryui 1.8.1 but doesn't on 1.10.3.

One more thing: I use multiple autocomplete fields. Therefore, I can not set it globally. For instance, $.ui.autocomplete.prototype._renderItem = customRenderItem would work, but will affect all of my autocompletes.

Answer 1

Using ui-autocomplete instead should solve your issue.

$("#lexicon-search-input")
    .autocomplete({
    ...
    }).data("ui-autocomplete")._renderItem = customItemRenderer;

See the documentation for a tutorial on how to use _renderItem (especially the source code)

If you want to create the _renderItem function for multiple autocompletes with class yourClass just use it in the createevent

$('.yourClass').autocomplete({
    create: function() {
        $(this).data('ui-autocomplete')._renderItem ....
    }
});

See another answer of me on that topic.