如何在 ASP.NET Core MVC 中使用 jQuery Ajax 自动完成与 ADO.NET

How to use jQuery Ajax autocomplete in ASP.NET Core MVC with ADO.NET

为自动完成添加的脚本:

$("txtSearch").autocomplete({
                    source: function (request, response) {
                        $.ajax({
                            url: '/ProductSearchDisplay/GetProductDetailsById/',
                            data: "{'prefix': '" + request.term + "'}",
                            dataType: "json",
                            type: "POST",
                            contentType: "application/json; charset=utf-8",
                            success: function (data) {
                                debugger
                                response($.map(data, function (item) {
                                    return item;
                                }))
                            },
                            error: function (response) {
                                alert(response.responseText);
                            },
                            failure: function (response) {
                                alert(response.responseText);
                            }
                        });
                    },
                    select: function (e, i) {
                        $("#txtSearch").val(i.item.val);
                    },
                    minLength: 1
                });
            })

发送列表数据的控制器方法:

public JsonResult GetProductDetailsById(String prefix)
{
    List<ProductMaster> ObjProduct = new List<ProductMaster>();
    ObjProduct = objProductData.SearchProductData(prefix).ToList();
    ViewBag.data = ObjProduct;            
    return Json(ObjProduct);
}

该代码也不适用于自动完成搜索添加的脚本。

恐怕这个问题缺少“#”

这是我的测试代码

<link rel="stylesheet" href="//code.jquery.com/ui/1.13.0/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://code.jquery.com/ui/1.13.0/jquery-ui.js"></script>
<input id="txtSearch" />
<script>
    $("#txtSearch").autocomplete({
    //source: ["c++", "java", "php", "coldfusion", "javascript"],
    source: function (request, response) {
        var param = { "prefix": request.term};
        $.ajax({
            url: '/test/getData/',
            //data: "{'prefix': '" + request.term + "'}",
            data: JSON.stringify(param),
            dataType: "json",
            type: "POST",
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                console.log(data);
                response($.map(data, function (item) {
                    return item;
                }))
            },
            error: function (response) {
                alert(response.responseText);
            },
            failure: function (response) {
                alert(response.responseText);
            }
        });
    },
    select: function (e, i) {
        $("#txtSearch").val(i.item.val);
    },
    minLength: 1
});
</script>

这是我的控制器,我没有完成过滤器:

[HttpPost]
public JsonResult getData([FromBody] TestModel model)
{
    List<string> res = new List<string>
    {
        "c++", "java", "php", "coldfusion", "javascript"
    };
    return Json(res);
}