jQuery UI Autocomplete: Tell It My 'Label' and 'Value'
From reading the Jquery UI docs you can try something like this:
<script>
$(function() {
var projects = [ { id: "12",value: "Don Davis" }, { id: "17", value:"Stan Smith" } ]
$( "#project" ).autocomplete({
minLength: 0,
source: projects,
focus: function( event, ui ) {
$( "#project" ).val( ui.item.value);
return false;
},
select: function( event, ui ) {
$( "#project" ).val( ui.item.value);
$( "#project-id" ).val( ui.item.id);
return false;
},
search: function(event, ui) { console.log(event); console.log(ui) }
})
.data( "autocomplete" )._renderItem = function( ul, item ) {
return $( "<li></li>" )
.data( "item.autocomplete", item )
.append( "<a>" + item.value+"</a>" )
.appendTo( ul );
};
});
</script>