?php
//connection information $host = "*
"; $user = "*
"; $password = "*
"; $database = "*
"; $param = $_GET["term"]; //make connection $server = mysql_connect($host, $user, $password); $connection = mysql_select_db($database, $server); //query the database $query = mysql_query("SELECT id, firstname, lastname FROM myMembers WHERE firstname LIKE '$param%'"); //build array of results for ($x
= 0, $numrows = mysql_num_rows($query); $x < $numrows; $x++) { $row = mysql_fetch_assoc($query); $friends[$x] = array("firstname" => $row["firstname"]);
///need to add the id here as a value but how?////
} //echo JSON to page $response = $_GET["callback"] . "(" . json_encode($friends) . ")"; echo $response; mysql_close($server); ?>
<div id="formWrap"> <form id="messageForm" action="#"> <fieldset> <legend>New message form</legend> <span>New Message</span> <label id="toLabel">To:</label> <div id="friends" class="ui-helper-clearfix"> <input id="to" type="text"> </div> <label>Subject:</label> <input id="subject" name="subject" type="text"> <label>Message:</label> <textarea id="message" name="message" rows="5" cols="50"></textarea> <button type="button" id="cancel">Cancel</button> <button type="submit" id="send">Send</button> </fieldset> </form> </div> <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js"></script> <script type="text/javascript"> $(function(){ //attach autocomplete $("#to").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("#to"); }, //define select handler change: function() { //prevent 'to' field being updated and correct position $("#to").val("").css("top", 2); } }); //add click handler to friends div $("#friends").click(function(){ //focus 'to' field $("#to").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) { $("#to").css("top", 0); } }); }); </script>