Question

我正在创建一个MVC5应用程序，我已经通过Nuget包将jQuery UI安装到应用程序，它安装了1.11.1版本。然后，在我的_Layout.cshtml文件中，我有类似的东西：

@Styles.Render("~/Content/css")
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/bundles/jquery")
<script src="~/Scripts/jquery-ui-1.11.1.js"></script>

另外，在我看来，我有这样的定义：

<div class="form-group">
     @Html.LabelFor(model => model.ServiceName, "Service", htmlAttributes: new { @class = "control-label col-md-2" })
     <div class="col-md-10">
          @Html.EditorFor(model => model.ServiceName, new { htmlAttributes = new { @class = "form-control", @id = "service-manual" } })
          @Html.ValidationMessageFor(model => model.ServiceName, "", new { @class = "text-danger" })
      </div>
</div>

最后，我编写了一些C＃代码，从数据库中获取一些信息，并生成一个JSON文件。然后，我有一个JS部分，我在那里做一些AJAX调用，以便自动完成工作。它看起来像这样：

$("#service-manual").autocomplete({
    source: function(request, response) {
        $.ajax({
            url: "/Home/GetBusinessDesriptions",
            dataType: "json",
            data: {
                state: $("#StateID").val(),
                term: request.term
            },
            success: function (data) {
                response(data);
            }
        });
    },
    minLength: 2,
    select: function (event, ui) {
        console.log(ui.item.value);
        $("#service-manual").val(ui.item.value);
        $("#service-manual").text(ui.item.value);
    }
});

另外不要忘记提及，我在我的视图中调用了我的脚本：

@section scripts {
    <script src="~/Scripts/main.js"></script>
}

所以，关键是当我打开视图，然后我开始输入标签时，我会从自动填充中获得建议，但是我无法按下我想要的那个并选择它，只需让它出现作为我标签内的文字。

当我移动鼠标（悬停鼠标）完成自动填充返回的建议时，我收到以下错误消息：

TypeError：item is undefined jquery-ui-1.11.1.js：2971

而且，每当我按下我想要的建议时，我都会收到以下错误消息：

TypeError：ui.item未定义main.js：86

我猜jQuery UI Autocomplete和MVC中的Html.EditorFor之间存在一些冲突。知道问题可能是什么，我该如何解决呢？

修改

服务器端，生成JSON文件：

    public JsonResult GetBusinessDesriptions(int state, string term)
    {
        var results = db.Users.OfType<Business>().Where(b => b.StateID == state && (term == null || b.Description.ToLower().Contains(term.ToLower()))).Select(x => new { id = x.StateID, value = x.Description }).Distinct().Take(5).ToList();

        return Json(results, JsonRequestBehavior.AllowGet);
    }

jQuery UI Autocomplete似乎不适用于MVC5

0 个答案: