Note that there are some explanatory texts on larger screens.

plurals
  1. POJquery UI Autocomplete Custom HTML (item is undefined)
    primarykey
    data
    text
    <p>I've been banging my head off my desk trying to get the jQuery UI Autocomplete to output custom HTML. Here is my code.</p> <pre><code> $(document).ready(function(){ $.widget( "custom.catcomplete", $.ui.autocomplete, { _renderMenu: function( ul, items ) { var self = this, currentCategory = ""; $.each( items, function( index, item ) { if ( item.category != currentCategory ) { ul.append( "&lt;li class='ui-autocomplete-category'&gt;" + item.category + "&lt;ul class='autocomplete-category'&gt;&lt;/ul&gt;&lt;/li&gt;" ); currentCategory = item.category; } self._renderItem( ul, item); }); } }); var data = [ { label: "anders", category: "Antigen" }, { label: "andreas", category: "Antigen" }, { label: "antal", category: "Antigen" }, { label: "annhhx10", category: "Products" }, { label: "annk K12", category: "Products" }, { label: "annttop C13", category: "Products" }, { label: "anders andersson", category: "People" }, { label: "andreas andersson", category: "People" }, { label: "andreas johnson", category: "People" } ]; $( "#typeAhead" ).catcomplete({ delay: 0, source: data, }) .data( "catcomplete" )._renderItem = function( ul, item ) { return $( "&lt;li&gt;&lt;/li&gt;" ) .data( "item.catcomplete", item ) .append( $( "&lt;a class='ui-menu-item'&gt;&lt;/a&gt;" ).text( item.label ) ) .appendTo( $('ul').last('.autocomplete-category')); }; }); </code></pre> <p>I seem to be running into trouble by nesting my lists in the renderItem function. The HTML output is exactly how I want it. However when I "keydown" the I get a javascript error (item is undefined).</p> <p>Any ideas or suggestions? I've tried just about everything.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload