这是我尝试使用的代码(从远程 json 中提取的部分,从自定义数据显示中删除的部分):
$(function () {
$("#Field1Text").autocomplete({
minLength: 0,
source: function (request, response) {
$.ajax({
url: "/Main/Users/GetItems",
dataType: "json",
data: {
group: "Default",
query: request.term
}
},
focus: function (event, ui) {
$("#Field1Text").val(ui.item.Description);
return false;
},
select: function (event, ui) {
$("#Field1Text").val(ui.item.Description);
return false;
}
})
.data("autocomplete")._renderItem = function (ul, item) {
return $("<li>")
.data("item.autocomplete", item)
.append("<a><strong>" + item.Description + "</strong><br>" + item.Section + " - " + item.Type + " - " + item.Name + "</a>")
.appendTo(ul);
};
});
数据恢复正常,但渲染项功能永远不会触发。我已经废弃了渲染项版本并使用了 success: inside of source ,它看起来像这样:
success: function (data) {
response($.map(data, function (ul, item) {
return $("<li>")
.data("item.autocomplete", item)
.append("<a><strong>" + item.Description + "</strong><br>" + item.Section + " - " + item.Type + " - " + item.Name + "</a>")
.appendTo(ul);
}));
}
我使用了 firebug,并且能够在响应部分打断点:如果我查看 data 中的数据,它看起来像:
[ Object { ...data... }, Object { ...data... }]
如果我在成功部分的行设置断点.data
,我会看到 ul 是对象之一( looks like " Object { ... data ... }")
item 元素此时为 0,当我尝试渲染<a>
标签时,它在所有属性上都显示为 Undefined (可以理解,看起来将 item 对象视为int
)。
如何让该组件正确处理?
编辑:对不起,我想根据评论中的建议添加一个 jsFiddle,但有家庭事务。
我评论了与我们在工作中使用的代码相似的代码。不幸的是,该网络应用程序是一个内部应用程序,其数据库未连接到外部世界,因此我无法使用实时数据。testResults 对象就是我在success: section的数据元素中看到的。
我实际上能够触发成功部分,但我不相信我正在正确使用 jQuery UI/Autocomplete(至少是我的假设),因为我能够查看 ul.Properties 并查看真实数据。附加项目使用虚假数据,但是当我尝试将成功块复制并粘贴到渲染项目中时,所有数据都未定义。在那个阶段我也找不到一对一的映射(ul 是页面上的元素,item 只是 [li])。