jquery ui - How to patch *just one* instance of Autocomplete on a page?

Question

This answer -- jQueryUI: how can I custom-format the Autocomplete plug-in results? -- describes how to monkeypatch the jqueryUI autocomplete widget, so that it displays things in a particular way. The approach it uses is to replace a function on the $.ui.autocomplete.prototype.

This means that all autocomplete widgets will get this patch.

Is there a way to patch the autocomplete widget for just one input element? What is it?

When I examine $('$input').autocomplete , I don't see any of the autocomplete fns there (_renderItem, _renderMenu, _search, etc).

Answer 1

Check out the custom data and display demo. This demo is not modifying the prototype object of the autocomplete widget, meaning that only that instance of the widget is effected:

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

Here's a working demo: http://jsfiddle.net/vJSwq/