JQuery UI autocomplete with json and ajax

You can stick very much to the remote demo of jQuery UI's Autocomplete: http://jqueryui.com/resources/demos/autocomplete/remote-jsonp.html

To get your results into the autocompleted list, you need to put a object with a label and a value to the response parameter (which is actually a function) inside your ajax success function:

source: function( request, response ) {    $.ajax({        url: "fill_id.php",        data: {term: request.term},        dataType: "json",        success: function( data ) {            response( $.map( data.myData, function( item ) {                return {                    label: item.title,                    value: item.turninId                }            }));        }    });}

But this will only work if you modify yor fill_id.php a bit:

// escape your parameters to prevent sql injection$param   = mysql_real_escape_string($_GET['term']);$options = array();// fetch a title for a better user experience maybe..$db = new SQLite3('database/main.db');    $results = $db->query("SELECT distinct(turninId), title FROM main WHERE turninid LIKE '".$param."%'");while ($row_id = $results->fetchArray()) {    // more structure in data allows an easier processing    $options['myData'][] = array(        'turninId' => $row_id['turninId'],        'title'    => $row_id['title']    ); }// modify your http header to json, to help browsers to naturally handle your response withheader('Cache-Control: no-cache, must-revalidate');header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');header('Content-type: application/json');echo json_encode($options);

Of course, when you don't have a title or anything in your table, you can also just leave your response as it is and repeat the id in your success callback. Important is, that you fill your response function in the autocomplete with a value/item pair:

// this will probably work without modifying your php file at all:response( $.map( data, function( item ) {    return {        label: item,        value: item    }}));

edit: updated the reference link to the new jquery UI's autocomplete ui