The code I am using creates a span after picking a member from the database so the form will not send because it is empty i need to create a hidden field with the id info from the JSON results
can anybody assist me with the addition to this piece of code to accomplish this?
$(function(){
//attach autocomplete
$("#messageTo").autocomplete({
//define callback to format results
source: function(req, add){
//pass request to server
$.getJSON("friends.php?callback=?", req, function(data) {
//create array for response objects
var suggestions = [];
//process response
$.each(data, function(i, val){
suggestions.push(val.firstname);
});
//pass array to callback
add(suggestions);
});
},
//define select handler
select: function(e, ui) {
//create formatted friend
var friend = ui.item.value,
span = $("<span>").text(friend),
a = $("<a>").addClass("remove").attr({
href: "javascript:",
title: "Remove " + friend
}).text("x").appendTo(span);
//add friend to friend div
span.insertBefore("#messageTo");
},
//define select handler
change: function() {
//prevent 'to' field being updated and correct position
$("#messageTo").val("").css("top", 2);
}
});
//add click handler to friends div
$("#friends").click(function(){
//focus 'to' field
$("#messageTo").focus();
});
//add live handler for clicks on remove links
$(".remove", document.getElementById("friends")).live("click", function(){
//remove current friend
$(this).parent().remove();
//correct 'to' field position
if($("#friends span").length === 0) {
$("#messageTo").css("top", 0);
}
});
});