映射JSON对JQuery自动完成的AJAX响应

我一直在玩JQuery自动完成。下面就http://www.asp.net/ajaxlibrary/jquery_mvc_autocomplete.ashx 映射JSON对JQuery自动完成的AJAX响应

的示例中的自动完成组件显示2个空白entires（尽管如果我选择一个选项被填充隐藏字段我用来存储选定titleID是）。

我怀疑我没有正确映射回应，而且这是真的很明显我缺少的东西，但是，不能为我的生活发现它。

控制器方法。

public ActionResult SearchTitle(string term) 
    { 
     var results = new List<Models.Title>{ new Models.Title{ Name = "TestResponse1",TitleId=123 }, new Models.Title { Name = "TestResponse2", TitleId=234} }; 
     return Json(results.ToArray(),JsonRequestBehavior.AllowGet); 
    }

查看

@using (Html.BeginForm()) 
{ 
    <h3>Add a new subscription</h3> 
     @Html.TextBox("Name") 
     @Html.Hidden("TitleId") 
     <input type="submit" value="Find Title" /> 

} 


@Styles.Render("~/Content/themes/base/css") 

<script type="text/javascript"> 
    $("#Name").autocomplete({ 
     source: '@Url.Action("SearchTitle")', 
     dataType: "json", 
     messages: { noResults: 'No titles found' }, 
     select: function (event, ui) { 
      $("#TitleId").val(ui.item.TitleId); 
     } 

    }); 

</script>

任何人能发现什么，我做错了什么？

确定下面的建议自动完成现在显示值，但是当我从下拉列表中选择一个项目时没有任何反应。任何人都可以发现我错过了什么吗？

<script type="text/javascript"> 
    $("#Name").autocomplete({ 
     source: '@Url.Action("SearchTitle")', 
     dataType: "json", 
     messages: { noResults: 'No titles found' }, 
     focus:function(event,ui){ 
      $("#Name").val(ui.item.Name); 
      return false; 
     }, 
     select: function (event, ui) { 
      $("#Name").val(ui.item.Name) 
      $("#TitleId").val(ui.item.TitleId); 
      return false; 
     } 
    }) 
    .data("ui-autocomplete")._renderItem = function (ul, item) { 
     return $("<li>") 
      .append(item.Name) 
      .appendTo(ul) 
    }; 

</script>

来源

2014-02-09 DazManCat

您是否尝试过退出'JSON（results.ToArray（），JsonRequestBehavior.AllowGet）;'先寄了吗？请确保响应在打到客户端代码之前是干净的？ – arb

是的，反应很干净。我在回车线上放了一个断点，并在Chromes开发人员工具中查看了响应。 – DazManCat

通过SearchTitle返回的数据不是一个简单的字符串列表 - 这是一个自定义格式，和jQuery UI自动完成不知道什么值应在下拉列表中显示。你应该看看自定义数据样本：

http://jqueryui.com/autocomplete/#custom-data

jQuery用户界面自动完成将寻找一个label财产弄清楚什么应该被显示给用户，并且value属性（它可以是一个对象，不一定是一个普通的字符串）作为基础数据。您需要在服务器上（在SearchTitle或新的操作方法中）或在客户端上（通过在执行此转换的位置指定一个函数作为source属性）将您的自定义数据转换为此格式。这里是你会怎么做这个客户端上（警告 - 未测试）的例子：

$("#Name").autocomplete({ 
    source: function(request, response) { 
     $.getJSON('@Url.Action("SearchTitle")', { term: request.term }, function(data, status, xhr) { 
      var titles = $.map(data, function (title) { 
       return { 
        label: title.Name, 
        value: title.TitleId 
       }; 
      }); 
      response(titles); 
     }); 
    }, 
    // ...   
});

来源

2014-02-09 17:07:24

啊，这是有道理的！ – DazManCat

映射JSON对JQuery自动完成的AJAX响应

回答

相关问题