jQuery自动完成数据

时间:2016-11-15 00:45:16

标签: php jquery

目前正在实施jQuery自动完成,数据正在从php文件传回并填充字段,但自动完成下拉列表中没有任何文本。您可以选择条目

图片:enter image description here

好像结果的文本没有被传回?

try {
    $stmt = $db->prepare('SELECT id, firstname, surname, department, email FROM users WHERE firstname LIKE :term');
    $stmt->execute(array('term' => '%'.$_GET['term'].'%'));

    while($row = $stmt->fetch()) {
        $row_array['id'] =  $row['id'];
        $row_array['firstname'] =  $row['firstname'];
        $row_array['surname'] = $row['surname'];
        $row_array['email'] = $row['email'];
        $row_array['department'] = $row['department'];

        $return_arr[] = $row_array;

    }

} catch(PDOException $e) {
    echo 'ERROR: ' . $e->getMessage();
}


/* Toss back results as json encoded array. */
echo json_encode($return_arr);
}

//jQuery
$(document).ready(function() {
$(".auto").autocomplete({
    source: "search.php",
    minLength: 1,
    datatype: 'json',
    select: function( event, ui ) {
      $('#firstname').val(ui.item.firstname)
      $('#surname').val(ui.item.surname);
      $('#department').val(ui.item.department);
      $('#email').val(ui.item.email);
      $('#hidden').val(ui.item.id);
    }
});
});

1 个答案:

答案 0 :(得分:0)

正如文档中所述,最简单的形式是,您的JSON响应可以是字符串数组:

[ "Choice1", "Choice2" ] 

它也可以是包含标签和要在自动填充字段中显示的值的对象数组,例如:

[ { label: "Choice1", value: "value1" }, ... ]

实际上,JQuery UI自动完成插件无法处理您返回的数据结构。

请参阅此处的详细文档:http://api.jqueryui.com/autocomplete/#option-source

希望这有帮助。