映射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響應

回答

相關問題