Parsing in jQuery Autocomplete - php

Question

I have generated some data from a MySQL query that I want to do two things with. The data is an array of names and IDs.
First I want to use the name portion for a jQuery autocomplete, so that the name is what you can select in the field.
Secondly, I want to fire on select in the autocomplete something that will place the ID of the selected item into a hidden field.
Here is my JQuery:
$("#contact").autocomplete(
source: function(request, response){
$.ajax({
url: "ajax/grabdata.php?",
type: "GET",
data: request,
success: function (data) {
response($.map(data, function (el) {
return {
label: el.item.name,
value: el.item.id
};
}));
}
});
},
width: 260,
matchContains: true,
selectFirst: false,
select: function(event, ui){
$('#contact').val(ui.label);
$('#id').val(ui.value);
}
});
Here is how I grabbed the data in PHP (grabdata.php):
$sql = "SELECT DISTINCT contacts.id, contacts.firstname, contacts.lastname FROMcontacts WHERE (firstname LIKE '%$q%' OR lastname LIKE '%$q%')";
$rsd = mysql_query($sql);
while($rs = mysql_fetch_array($rsd)) {
$kdata[] = array(
"name" => $rs['firstname'].' '.$rs['lastname']."\n",
"id" => $rs['ID']."\n",
);
$dataset[] = $kdata;
}
I can get the data, but I am having trouble parsing it into what I want. The name should be selectable in the autocomplete field, and the ID should be filled in based on the name chosen.

Answer 1

As far as I can see, you are not using the select method parameters as you should:
select: function(event, ui){
$('#contact').val(ui.item.label);
$('#id').val(ui.item.value);
}
You are missing the ".item". Check the documentation: http://jqueryui.com/autocomplete/#remote