Question

我正在开发一个项目，我需要让用户输入一个下拉列表。

这是因为大约有17000条记录（公司名称），由于必须加载这么多记录，页面需要几秒钟才能开始响应（TTFB）。

因此，一旦有人开始输入，我想填写下拉列表，其中的记录与该人正在输入的内容相匹配。

除了输入下拉列表外，我已经拥有了所有内容。你们中的任何人都知道如何允许吗？

到目前为止我的代码：

查看：

<div class="form-group">
    @Html.LabelFor(model => model.CompanyRecId, "Company", new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.DropDownList("CompanyRecId", String.Empty)
        @Html.ValidationMessageFor(model => model.CompanyRecId)
    </div>
</div>

<script type="text/javascript">
    $(function () {
        $("#CompanyRecId").change(function () {
            var text= $(this).text();
            var subItems = "";
            console.log("JSON activated");
            $.getJSON("@Url.Action("GetCompanyList", "Delivery")", {searchstring:text}, function (data) {
              $.each(data,function(index,item){
                subItems+="<option value='"+item.Value+"'>"+item.Text+"</option>"
              });
              $("#CompanyRecId").html(subItems)
            });
        });
    });
</script>

控制器：

public ActionResult GetCompanyList(string SearchString)
    {
        SelectList CompanyList = new SelectList(db.Companies.Where(s => s.CompanyRecID != 0).Where(s => s.Company1.ToString().ToUpper().Contains(SearchString.ToUpper())).OrderBy(s => s.Company1), "CompanyRecID", "Company1");
        return Json(CompanyList, JsonRequestBehavior.AllowGet);
    }

Answer 1

你为什么要重新发明轮子？您可以使用jQueryUI Autocomplete widget或其中任意一个自动完成小部件。

我对jQueryUI Autocomplete的唯一警告是，我必须在隐藏字段中设置所选值（在select事件上），以便随表单一起提交。当然，您必须正确命名隐藏字段。

可输入的MVC ASP.Net下拉列表

1 个答案: