javascript - 使用 id 和值自动完成下拉列表

Question

我想自动完成下拉列表。

这是我的json 字符串:

[{"ID":1,"Name":"david"},{"ID":2,"Name":"Paul"}]

这是我的输入:

    <input type="text" id="tbNames" />

这是我的javascript:

    //datas variable contains the json string
    function BindNames(datas) { 
        $('#tbNames').autocomplete({
            source: datas,
            minLength: 0,
            scroll: true,
            select: function (event, ui) {
                $("#tbNames").val(ui.item.Name);
                return false;
            } 
        }).focus(function () {
            $(this).autocomplete("search", "");
        });
    }

问题是，当我单击“tbNames”输入时，会显示下拉列表，但内部名称不会显示，但列表中有名称，因为当我单击下拉列表中的两个列表之一时名称显示在我的输入中。

http://jsbin.com/wudidaqapo/1/edit?html,css,js,console,output

感谢您的帮助。

Answer 1

试试这个:

 function BindNames() {
             var datas=[{"ID":1,"Name":"david"},{"ID":2,"Name":"Paul"}];

            $('#tbNames').autocomplete({

               source: function (request, response) {
                response($.grep(($.map(datas, function (v, i) {

                return {
                    label: v.Name,
                    value: v.ID
                };
               })), function (item) {
                  return item.label;
               }));
               },
              minLength: 0,
            scroll: true,

    }).focus(function () {
            $(this).autocomplete("search", "");
        });
}