如何在jquery-ui自动完成中映射数据不起作用

我正在使用jquery-ui自动完成并在自动完成function中进行ajax调用我正在调用我的控制器操作返回Json，但建议未显示在下拉列表中

使用Javascript

function log(message) { $("
").text(message).prependTo("#log"); $("#log").scrollTop(0); } $("#search").autocomplete({ source: function (request, response) { $.ajax({ url: "/Home/GetCompanyNames", dataType: "jsonp", data: "searchterm=" + request.term, success: function (data) { response($.map(data, function (item) { alert(item.Value); return { label: item.Name, value: item.Name }; })); } }); }, minLength: 2, select: function (event, ui) { log(ui.item ? "Selected: " + ui.item.label : "Nothing selected, input was " + this.value); }, open: function () { $(this).removeClass("ui-corner-all").addClass("ui-corner-top"); }, close: function () { $(this).removeClass("ui-corner-top").addClass("ui-corner-all"); } }); }); 

控制器中的行动：

  public JsonResult GetCompanyNames (string searchterm) { var companies = context.companyService.Query().Where(x => x.Name.Contains(searchterm)).ToList(); var list = companies.Select(item => new SearchJsonModel { LogoUrl = item.Logo != null || item.Logo != "" ? "" : "", Name = item.Name, Value = item.InternetName }).Select(model => (model)).ToList(); return Json(list, JsonRequestBehavior.AllowGet); } 

SearchJsonModel：

  public class SearchJsonModel { public string Name { get; set; } public string Value { get; set; } public string LogoUrl { get; set; } } 

这就是我在响应ajax调用时所得到的（这是firebug的图像）

请问我是否需要更多细节并提前致谢。

编辑

现在我试图在select回调中访问选定的值，但它给出Undefined

 select: function (event, ui) { alert(ui.item.Name); alert(ui.item.Value); alert(ui.item.LogoUrl); }, 

Answer 1

您已将dataType定义为jsonp但看起来您正在返回标准json ，请尝试更改您的dataType ：

 $("#search").autocomplete({ source: function (request, response) { $.ajax({ url: "/Home/GetCompanyNames", dataType: "json", data: "searchterm=" + request.term, success: function (data) { response($.map(data, function (item) { return { label: item.Name, value: item.Name }; })); }}); }, minLength: 2, select: function (event, ui) { log(ui.item ? "Selected: " + ui.item.label : "Nothing selected, input was " + this.value); }, open: function () { $(this).removeClass("ui-corner-all").addClass("ui-corner-top"); }, close: function () { $(this).removeClass("ui-corner-top").addClass("ui-corner-all"); } }); 

Answer 2

我不确定你的代码有什么问题，但可能你可以尝试另一种更简单的方法来做自动完成？ 喜欢

 $(document).ready(function () { $(":input[dataautocomplete]").each(function () { $(this).autocomplete({ source: $(this).attr("dataautocomplete"), minLength: 2, select: function (event, ui) { //do anything u need //get ur name ui.item.Name //get ur URL ui.item.LogoUrl } }); }); }); 

喜欢的HTML