首页 文章

ASP.NET Core jquery Autocomplete 返回列表中的空白行

提问于
浏览 次
5

我正在使用带有 Boostrap 4 的 ASP.NET 核心 jquery 自动完成功能我已成功运行以下示例：https://jqueryui.com/autocomplete/

我现在正在寻找使用我的控制器中的数据来正确返回数据。我得到的结果是空行。

在此输入图像描述

这是我的剃刀页面

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

<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>

<div class="ui-widget">
    <label>Autocomplete Example: </label>
    <input id="LastName" name="LastName" type="text" />
</div>
<script>
    $("#LastName").autocomplete({
        source: '@Url.Action("GetName","Home")'
    });
</script>

这是我的控制器[7] public IActionResult GetName(string term){

List<TransactionName> list = new List<TransactionName>()
        {

            new TransactionName {Id=1,LastName="Linda" },
            new TransactionName {Id=2,LastName="Donna" },
            new TransactionName {Id=3,LastName="Maryanne" },
            new TransactionName {Id=4,LastName="Deb" },
            new TransactionName {Id=5,LastName="Liz" },
            new TransactionName {Id=6,LastName="Bobby" },
            new TransactionName {Id=7,LastName="Beth" }

    };
        var result = (from N in list
                        where N.LastName.Contains(term)
                        select new {N.LastName });
        return Json(result);
    }

在此输入图像描述

jquery asp.net-core autocomplete

2 回答

  • 2

    我根据 jquery 自动完成文档更改了以下内容：

    var result = (from N in list
                    where N.LastName.Contains(term)
                    select new {value=N.LastName });

    这是从他们的网站上获取的文档的一部分。支持多种类型：数组：数组可用于本地数据。有两种支持的格式：字符串数组：[3]具有标签和值属性的对象数组：[4]

    回复于
  • 0

    您的结果将返回到您的浏览器：

    {
    "Linda",
    "Donna",
    //... etc
}

    你真正想要回归的是：

    [
    "Linda",
    "Donna",
    //... etc
]

    为此，只需将您的返回行更改为：

    return Json(result.ToArray());

    如果这不起作用，请使用浏览器开发人员工具检查返回的结果，并修改返回行以按照自动完成方法的要求格式化输出。

    回复于

相关问题