Using the _renderItem Autocomplete Field

Question

I have a jQuery autocomplete field that still works. I decided to use _renderItem because I wanted to use some HTML in the results. Here is my code:

 function prepareClientField() { var renderItemFunction = function(ul, item) { return $("<li></li>") .data("item.autocomplete", item) .append(item.label) .appendTo(ul); }; $("#client_name").autocomplete({ source: clientNames, delay: 0 }).data("autocomplete")._renderItem = renderItemFunction; $("#client_name").focus(); } 

For the reason, now, I cannot use the up / down arrows in my autocomplete field. I can’t even use the mouse to click an item in the results. Is there anything else I need to do to make this really work?

Answer 1

The autocomplete plugin is heavily dependent on the menu plugin, which uses the internal elements of a . therefore, removing the a element from each element breaks the menu plugin.

You can manually create the menu plugin and try to make it work, or you need to find another solution where the elements have the a tag but will not ruin your styles.