自动完成 ASP MVC 不填充项目

Question

我是 ASP MVC 和 jquery 的初学者，我尝试获取一些数据并将其填充到文本框中，Ajax 请求工作正常，但是当我返回结果时它不会填充到文本框中... 这是我的代码：

[HttpPost]
public JsonResult LookupProjects(string query)
{

  // some code here ...

  var result_ = (from item in resultProjekte select new { value item.AnzeigeI,        label =  item.AnzeigeID + " " + item.Name + " " + item.Kette + " " + item.Ort  });

  return Json(result_, JsonRequestBehavior.AllowGet);
}

捆绑

var css = new Bundle("~/bundles/less")
            .Include("~/Content/less/bootstrap.less",
            "~/Content/epoch.min.css",
            "~/Content/jquery.ui.autocomplete.css");
        css.Transforms.Add(cssTransformer);
        css.Orderer = nullOrderer;
        bundles.Add(css);

        // Scripts
        var scripts = new Bundle("~/bundles/scripts")
        .Include("~/Scripts/jquery-{version}.min.js",
                "~/Scripts/knockout-{version}.js",
                "~/Scripts/bootstrap.js",
                "~/ScriptsCustom/custom.js",
                "~/Scripts/jquery-ui.min.js");
        scripts.Transforms.Add(jsTransformer);
        scripts.Orderer = nullOrderer;
        bundles.Add(scripts);

布局（共享）视图

@Styles.Render("~/bundles/less")
@Scripts.Render("~/bundles/scripts")
@Scripts.Render("~/bundles/syncfusionScripts")
....

<div class="container-fluid board search-content" id="Search">
    @{Html.RenderAction("Create", "Search");}
</div>
....

@RenderSection("scripts",required : false)

搜索视图中的脚本

<input  id="TextBoxSearch" class="form-control" placeholder="Projekt Id, Ort, Service,   Plz ...">

$(document).ready(function () {
        $("#TextBoxSearch").autocomplete({
            source: function (request, response) {
                var projects = new Array();
                $.ajax({
                    async: true,
                    url: "@(Url.Action("LookupProjects", "Search"))",
                    dataType: "json",
                    type: "POST",
                    data: {
                        query: request.term
                    },
                    success: function (data) {
                        //alert("sucess");
                        response($.map(data, function (item) {

                            return {
                                label: item.label,
                                value: item.value
                            }
                        }))
                    }

                });

            },
            minLength: 3,

        });
    });

使用的 Jquery Bootstrap

那么这里出了什么问题？？我找回了搜索到的项目，但文本框没有显示建议！！！！我什至尝试过用一个简单的数组作为源

Answer 1

我已经执行了您的代码并在下面进行了修改，这些更改运行良好..

像这样声明模型

public class DemoEntity
{
    public string value { get; set; }
    public string label { get; set; }

}

控制器动作方法

public class HomeController : Controller
{

    [HttpGet]
    public ActionResult LookupProjects(string query)
    {

        // some code here ...
        var result = new List<DemoEntity>();
        for (int i = 0; i < 10; i++)
        {

            result.Add(new DemoEntity { label = "Ïtem" + i, value = "Ïtem" + i });
        }

        return Json(result, JsonRequestBehavior.AllowGet);
    }

public ActionResult Index()
    {
        return View();
    }
}

Index.cshtml 页面喜欢

 <input id="TextBoxSearch" class="form-control" placeholder="Projekt Id, Ort, Service,   Plz ...">   

$(document).ready(function () {
    $("#TextBoxSearch").autocomplete({
        source: function (request, response) {
            var projects = new Array();
            $.ajax({
                async: true,
                url: "@(Url.Action("LookupProjects", "Home"))",
                dataType: "json",
                type: "GET",
                data: {
                    query: request.term
                },
                success: function (data) {

                    //alert("sucess");
                    response($.map(data, function (item) {
                        return {
                            label: item.label,
                            value: item.value
                        }
                    }));
                }

            });

        },
        minLength: 3

    });
});

首先确保为 jquery、jqueryui 和 css 引用添加脚本引用