我无法在页面上使用自动完成功能,这很麻烦。当我在搜索输入中输入2个字符(“ OW”)时,我得到了预加载器图像(如下所示),但是它从未消失,也从未获得自动完成弹出窗口。查看Chrome中的控制台显示:
Uncaught TypeError: Cannot use 'in' operator to search for '62' in [{"value":103,"label":"FLOWER"},{"value":105,"label":"YELLOW"}]
这是返回的实际字符串(通过在成功块中添加alert(data)进行确认):
[{"kwrdID":103,"kwrdKeyWord":"FLOWER"},{"kwrdID":105,"kwrdKeyWord":"YELLOW"}]
这是自动完成的主要代码
$("#searchInput").autocomplete({ source: function (request, response) { $.ajax({ url: '@Url.Action("GetKeywords", "Home")', dataType: "json", data: { SearchTerm: request.term }, success: function (data) { response($.map(data.keywords, function (item) { return { label: item.kwrdKeyWord, value: item.kwrdID } })); } }); }, minLength: 2 });
最后,这是预加载器(以防万一有关联)。
$(document).ajaxStart(function () { var position = $('#divParent').position(); position.left += (($('#divParent').width() / 2) - ($('#preloader').width() / 2)); position.top += (($('#divParent').height() / 2) - ($('#preloader').height() / 2)); $('#preloader').css(position).show(); $('#preloader').show(); }).ajaxStop(function () { $('#preloader').hide(); });
有人可以帮忙解释一下发生了什么吗?
这是一条漫长的路,但是经过许多小时的试验,我想到了以下代码:
$("#searchInput").autocomplete({ source: function (request, response) { $.ajax({ url: '@Url.Action("GetKeywords", "Home")', dataType: "json", data: { SearchTerm: request.term }, success: function (data) { var parsed = JSON.parse(data); var newArray = new Array(parsed.length); var i = 0; parsed.forEach(function (entry) { var newObject = { label: entry.kwrdKeyWord }; newArray[i] = newObject; i++; }); response(newArray); }, error: function (message) { response([]); } }); }, minLength: 2 });
这似乎工作正常。事实是我的关键字是唯一的,因此无论如何我都可以不用ID。