JQuery UI 1.12.1自动完成不起作用

时间:2019-05-11 10:05:11

标签: javascript jquery asp.net model-view-controller

在使JQuery UI正常工作时遇到一些问题。

我使用的查询UI版本是最新的1.12.1。我下载了自动完成功能(以及所有其他必需的小部件)。

在我的项目中,我将jquery-ui.js,jquery-ui-min.js和jquery.js包含在“脚本”文件夹中。我还将“图像”文件夹,jquery-ui.css和jquery-ui-min.css包含在“内容”文件夹中。

布局视图

...
<head>
    ...
    <link href="~/Content/jquery-ui.css" rel="stylesheet" />
    <link href="~/Content/jquery-ui.min.css" rel="stylesheet" />
</head>
<body>
    ...
    <script src="~/Scripts/jquery-ui.js"></script>
    <script src="~/Scripts/jquery-ui.min.js"></script>
    <script src="~/Scripts/jquery.js"></script>
</body>

主视图

<script type="text/javascript">
    $(document).ready(function () {
        $("#tbxTest").autocomplete({
            source: '@Url.Action("SearchElement", "Home")'
        });
    });
</script>

@using (Html.BeginForm())
{
    @Html.TextBox("searchText", null, new { id = "tbxTest" })
    <input type="submit" value="Search" />
}

控制器

...
public JsonResult SearchElement(string term)
{
    List<string> testingElement = new List<string>() { "Alpha", "Beta", "Charlie", "Delta" };

    List<string> searchResult = testingElement.Where(x => (string.Compare(x, term, true) == 0)).ToList();

    return Json(searchResult, JsonRequestBehavior.AllowGet);
}

我尝试在控制器方法的第一行上放置断点,但未触发。请帮忙。

谢谢。

1 个答案:

答案 0 :(得分:0)

尝试更新您的jquery

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

对我有用。