MVC4-使用Json自動完成

Question

我正在使用ASP.NET MVC4和Entity Framework開發Intranet Web應用程序。 根據我的觀點之一，我列出了一些將來可能會很龐大的人員。 因此，為了使事情變得容易，我想使用jQuery UI和Json實現一個自動完成字段組件。

問題是，當我使用數據庫為jQuery代碼提供源時，它無法正常工作。 但是，當我通過對數據進行硬編碼創建變量時，它就可以工作。

我的動作：

public ActionResult AutoComplete(string term)
{
    BuSIMaterial.Models.BuSIMaterialEntities db = new Models.BuSIMaterialEntities();

    //var result = new [] {"A","B","C","D","E","F"}; with this, it works

    var result = (from obj in db.Persons where obj.FirstName.ToLower().Contains(term.ToLower()) select obj).ToArray(); // with this, it doesn't work

    return Json(result, JsonRequestBehavior.AllowGet);
}

我的觀點 ：

@{
    ViewBag.Title = "Auto";
}

<h2>Auto</h2>
<label for="persons">Persons : </label><input type="text" id="persons" name="persons"/>

@section Scripts
{
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/jqueryui")
    @Styles.Render("~/Content/themes/base/css")

    <script type="text/javascript" language="javascript">
        $(document).ready(function () {
            $('#persons').autocomplete({
                source: '@Url.Action("AutoComplete")'
            });
        });
    </script>
}

我試圖修改返回類型（用JsonResult代替ActionResult），但沒有任何變化。 有解決這個問題的主意嗎？

Answer 1

您的代碼不起作用的原因是，您試圖將域模型發送到視圖，該模型很可能在其對象圖中包含循環引用，並且無法JSON序列化。 要解決此問題，請執行以下操作：

public ActionResult AutoComplete(string term)
{
    BuSIMaterial.Models.BuSIMaterialEntities db = new Models.BuSIMaterialEntities();

    //var result = new [] {"A","B","C","D","E","F"}; with this, it works

    var result = db
        .Persons
        .Where(p => p.FirstName.ToLower().Contains(term.ToLower()))
        .Select(p => p.FirstName) // <!-- That's the important bit you were missing
        .ToList();

    return Json(result, JsonRequestBehavior.AllowGet);
}

注意我如何將Person實體投影到一個字符串（僅采用其FirstName ）。 在您的示例中，您直接使用了整個Person對象，這對於自動完成插件沒有意義，因為您需要向視圖發送字符串數組。