I have tried to modifu format of item using _renderItemData (or _renderItem) and used with remote source , it works fine till user press Arrow up/down and i get error:

Uncaught TypeError: Cannot read property 'value' of undefined L:6460

I have value field in my JSON source, when i remove _renderItemData , it works fine? 

Thanks

P

2. $.widget( "custom.beachcomplete", $.ui.autocomplete, {
3.     _renderMenu: function( ul, items ) {
4.       var that = this,
5.         currentCategory = "";
6.       $.each( items, function( index, item ) {
7.         if ( item.category != currentCategory ) {
8.           ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
9.           currentCategory = item.category;
10.         }
11.         that._renderItemData( ul, item );
12.       });
13.     },
14.     _renderItemData: function( ul, item ) {
15.          item.name = item.name.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(this.term) + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>");
16.          return $("<li></li>")
17.          .data("item.autocomplete", item)
18.          .append( "" + item.name + " (" + item.state + ")" )
19.          .appendTo(ul);
20.     }
21. });
22. 
    
23. 
    
24. 
    
25.