自动完成显示列表项的[对象对象]而不是值

Question

我的jQuery自动完成看起来像这样......

如果我发表console.log声明，我可以看到每个列表项实际上都有我想要的键/值对，但无论出于何种原因它都无法正常显示。我使用Ajax调用来填充列表，这是代码的样子

控制器

    public JsonResult GetDistributorInfo(string term)
    {
        var banks = from c in db.BankListMaster.Where(n => n.BankName.Contains(term))
                    select new
                        {
                            Key = c.ID,
                            Value = c.BankName
                        };

        return Json(banks, JsonRequestBehavior.AllowGet);
    }

的jQuery / AJAX

    var tempResults = [];
    $(function () {
        $('#DisplayDistributor').autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: '@Url.Action("GetDistributorInfo", "Agent")',
                    type: 'GET',
                    dataType: 'json',
                    data: request,
                    success: function (data) {
                        tempResults = data;
                        response($.map(data, function (value, key) {
                            return {
                                label: value,
                                value: key
                            };
                        }));
                    },
                });
            },
            minLength: 2,
            select: function (event, ui) {
                console.log(ui);
                $('#DistributorId').val(tempResults[ui.item.key]);
                $('#DisplayDistributor').text(tempResults[ui.item.value]);

                return false;
            }
        });
    });

Answer 1

返回的数据是一个对象数组。 value调用的$.map()参数包含对象，key参数是数组中项目的索引（请参阅第一个“重载”here）。因此，您将对象本身设置为label属性，这就是它显示为[object Object]的原因。

试试这个：

response($.map(data, function (item, idx) {
    return {
        label: item.Value,
        value: item.Key
    };
}));

Answer 2

您在响应中错误地使用了该项目并选择了方法：

1）您的回答应如下：

response($.map(data, function (item) {
    return {
        label: item.label,
        value: item.value
    };
}))

2）您的选择应如下所示：

select: function (event, ui) {
    $('#DistributorId').val(tempResults[ui.item.value]); // You are using item.key here
    $('#DisplayDistributor').text(tempResults[ui.item.label]);

    return false;
}