自动完成 jquery 插件不起作用 ASP.Net MVC 4答案

【问题标题】：Autocomplete jquery Plugin not working ASP.Net MVC 4自动完成 jquery 插件不起作用 ASP.Net MVC 4
【发布时间】：2013-06-17 22:48:41
【问题描述】：

-大家好，我正在尝试在 jquery 中使用自动完成功能，这是我的代码：

-此操作放置在名为 Agence 的控制器上，位于名为 Admin 的区域中。

public JsonResult GetAgences(string term)
        {
            return Json(_agenceRepo.SearchByNom(term), JsonRequestBehavior.AllowGet);
        }

-这里是repository的方法，将Value返回给JSon：

public IList<Agence> SearchByNom(string nom)
        {
            return _context.Agences.Where(a => a.Nom.Contains(nom)).ToArray();
        }

-这是jquery代码：

<label for="completeMe">Find:</label>
<input type="text" id="completeMe" />
<script type="text/javascript">
    $(function () {
        $("#completeMe").autocomplete({
            source: '@Url.Action("GetAgences", "Agence")',
            minLength: 1
            }
        });
    });
</script>

-所有这些代码都放在一个页面中，即具有搜索字段的页面。 - 这是我在母版页上的 JQuery 引用：

<meta charset="utf-8" />
    <title>@ViewBag.Title - My ASP.NET MVC Application</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    @Styles.Render("~/Content/css")
    <link href="@Url.Content("~/Content/themes/base/Bootstrap/bootstrap.css")" rel="stylesheet" type="text/css" />
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    <script src=  "@Url.Content("~/Scripts/Bootstrap/bootstrap.min.js")" type="text/javascript"></script>

-我遵循了所有需要的步骤，但是当我想要搜索结果时没有任何反应。我怀疑问题出在我的 jQuery 引用中。谢谢。

【问题讨论】：

这可能是个问题，我看到您正在渲染一个名为 ~/bundles/jquery 的包，然后在脚本标记中手动链接 jquery 之后直接渲染。确保您没有加载多个 jquery 文件。
我只留下一个，同样的问题
页面上是否有任何错误？另外，网络流量是什么样的？您在控制台中看到响应了吗？
我对jquery不太熟悉，所以你能告诉我应该做什么来查看网络流量吗？以及如何获得控制台 inti chrome ？
按 F12 并单击控制台选项卡，是否有任何 javascript 错误？

标签： jquery json jquery-ui asp.net-mvc-4 jquery-autocomplete

【解决方案1】：

我认为你的 ajax 调用有问题，你没有指定参数。这样做：

<script type="text/javascript">
$(function () {
    $("#completeMe").autocomplete({
        source: '@Url.Action("GetAgences", "Agence")',
        data: {term: 'xyz'}
        minLength: 1
        }
    });
});

【讨论】：

你能告诉我 line data: {term: 'xyz'} 是什么意思吗？