0

内容： 管理者がドロップダウンリストからユーザーを選択できるオートコンプリートを作成したいと思います。
また、選択したユーザーのIDを自分のページに表示したい。

問題：私が得ている問題は、空白のドロップダウンオートコンプリートフィールドであり、これを解決する方法がわかりません。また、IDは更新されていません。

コード

Javascript：

// Values
var names = [
    {
    id: 1,
    name: 'Max'},
{
    id: 2,
    name: 'John'},
{
    id: 3,
    name: 'Gray'},
{
    id: 4,
    name: 'Bob'},
{
    id: 5,
    name: 'Terminator'}
];

// Autocomplete start..
$('#suggested-users').autocomplete({
    source: names,
    select: function() {
        $('#user-id').html(ui.item.id);
    }
});​

HTML：

<html>

    <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/jquery-ui.js"></script>
    <link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.all.css">
    </head>

    <body>
        <input type="text" id="suggested-users">
        <hr>
        <p><strong>ID:</strong><span id="user-id"></span></p>
    </body>

</html>​

JSFiddle： JSFiddle

あなたの答えをありがとう！

4

2 に答える 2

3

label属性と。を持つオブジェクトを使用する必要がありますvalue。 ソース。

于 2012-10-22T21:12:39.970 に答える
2

このjsFiddleの例を試してください

var opt;
// Values
var names = [
    {
    label: 'Max',
    value: 1},
{
    label: 'John',
    value: 2},
{
    label: 'Gray',
    value: 3},
{
    label: 'Bob',
    value: 4},
{
    label: 'Terminator',
    value: 5}
];

// Autocomplete start..
$('#suggested-users').autocomplete({
    source: names,
    select: function(e, ui) {
        $('#user-id').html(ui.item.value);
        opt = ui.item.label;
    },
    close: function() {
        $('#suggested-users').val(opt);
    }
});​
于 2012-10-22T21:26:15.463 に答える