自动完成jquery多个字段onchange或tab事件

Question

So, I have this jquery code in my php page that gets data from a mysql table:

$(function() {
    $("#tracking_num").autocomplete({
        source: "func/populate.php",
        minLength: 2,
        select: function(event, ui) {
            $('#name').val(ui.item.name);
            $('#particulars').val(ui.item.particulars);
            $('#remarks').val(ui.item.remarks);
            $('#location').val(ui.item.location);
        }
    });
});

I'm challenged to get the data immediately into the fields without selecting it from the drop down box. Do you guys have any idea how to do it? Here's my the func/populate.php file:

$return_arr = array();

$fetch = mysql_query("SELECT * FROM tbl_document WHERE tracking_number = '" . mysql_real_escape_string($_GET['term']) . "' ORDER BY id DESC LIMIT 1");

while ($row = mysql_fetch_array($fetch) ) {
    $row_array['name'] = $row['name'];
    $row_array['particulars'] = $row['particulars'];
    $row_array['remarks'] = $row['remarks'];
    $row_array['location'] = $row['location'];
    $row_array['value'] = $row['tracking_number'];

    array_push($return_arr,$row_array);
}

mysql_close();

echo json_encode($return_arr);

Answer 1

Have you tried :

$(function() {
    $("#tracking_num").autocomplete({
        source: "func/populate.php",
        minLength: 2,
        create: function(event, ui) {
            $('#name').val(ui.item.name);
            $('#particulars').val(ui.item.particulars);
            $('#remarks').val(ui.item.remarks);
            $('#location').val(ui.item.location);
        }
    });
});

?