Javascript 如何在MVC5中使用数据库中的值进行自动完成？

目前，我有以下代码：

main.js:

$(function () {
    var keys = ["test1", "test2", "test3", "test4"];

    $("#keywords-manual").autocomplete({
        minLength: 2,
        source: keys
    });
});

@model App.Models.Service
@{
    ViewBag.Title = "Test";
}

<script src="~/Scripts/main.js"></script>

<h2>@ViewBag.Title.</h2>
<h3>@ViewBag.Message</h3>

@using (Html.BeginForm("SaveAndShare", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.AntiForgeryToken()
    <h4>Create a new request.</h4>
    <hr />
    @Html.ValidationSummary("", new { @class = "text-danger" })
    <div class="form-group">
        @Html.LabelFor(m => m.ServiceType, new { @class = "col-md-2 control-label" })
        <div class="col-md-10">
            @Html.TextBoxFor(m => m.ServiceType, new { @class = "form-control", @id = "keywords-manual" })
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" class="btn btn-default" value="Submit!" />
        </div>
    </div>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Test.cshtml:

$(function () {
    var keys = ["test1", "test2", "test3", "test4"];

    $("#keywords-manual").autocomplete({
        minLength: 2,
        source: keys
    });
});

@model App.Models.Service
@{
    ViewBag.Title = "Test";
}

<script src="~/Scripts/main.js"></script>

<h2>@ViewBag.Title.</h2>
<h3>@ViewBag.Message</h3>

@using (Html.BeginForm("SaveAndShare", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.AntiForgeryToken()
    <h4>Create a new request.</h4>
    <hr />
    @Html.ValidationSummary("", new { @class = "text-danger" })
    <div class="form-group">
        @Html.LabelFor(m => m.ServiceType, new { @class = "col-md-2 control-label" })
        <div class="col-md-10">
            @Html.TextBoxFor(m => m.ServiceType, new { @class = "form-control", @id = "keywords-manual" })
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" class="btn btn-default" value="Submit!" />
        </div>
    </div>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

@model App.Models.Service
@{
ViewBag.Title=“测试”；
}
@ViewBag.Title。
@查看包。留言
@使用（Html.BeginForm（“SaveAndShare”、“Home”、FormMethod.Post、new{enctype=“multipart/formdata”}））
{
@Html.AntiForgeryToken（）
创建一个新请求。

@Html.ValidationSummary（“，new{@class=“text danger”}）
@LabelFor（m=>m.ServiceType，新的{@class=“col-md-2控制标签”}）
@TextBoxFor（m=>m.ServiceType，新的{@class=“form control”，@id=“keywords manual”}）
}
@节脚本{
@Scripts.Render（“~/bundles/jqueryval”）
}

---

关键是，目前我刚刚为autocomplete提供了4个常量值。但随后我创建了一个数据库和一个名为“services”的表，它来自于我的名为Service的模型。我已经向表中提供了几行值。我的表中有一个名为ServiceType的字段，我希望autocomplete将该列的值作为源。请注意，我已经在Azure中托管了我的数据库，它是MySQL，不过，我认为这在这里并不重要。您能告诉我如何将位于我的服务表中的ServiceType列的值作为源吗？

根据您的问题，它应该是这样的：

$("#keywords-manual").autocomplete({
    source: function (request, response) {
        $.ajax({
            url: "/Home/GetServiceTypes",
            data: "{ 'keywords': '" + request.term + "' }",
            dataType: "json",
            type: "POST",
            contentType: "application/json; charset=utf-8",
            dataFilter: function (data) { return data; },
            success: function (data) {
                response($.map(data, function (item) {
                    return {
                        label: item.value,
                        value: item.value,
                        id: item.id
                    }
                }))
            }
        });
    },
    minLength: 2
});

以及控制员,

YourContext db = new YourContext();
public JsonResult GetServiceTypes() {
    db.ServiceType.Where(s => keywords == null || s.Name.ToLower()
        .Contains(keywords.ToLower()))
        .Select(x => new { id = x.ServiceTypeID, value = x.ServiceTypeName }).Take(5).ToList();
    return result;
}

对任何拼写错误表示歉意，但这应该是最重要的。如果需要搜索多个关键字，请在控制器方法中，将“keywords manual”中的值拆分为字符串数组，然后使用foreach循环或类似方法匹配每个值，每次将匹配项添加到总列表中

**我说的是字符串数组，这是一个非常古老的学派，把它分成一个列表：）