Javascript 如何将搜索栏添加到下拉列表？

有人能帮我添加搜索栏作为下拉列表的第一个值吗？我用的是ASP.NETMVC。这是我的密码

<div class="col-md-8">
    <div class="dropdown">
         <div class="chzn-dd-width">
               @Html.DropDownListFor(
                   model => model.DriverId, 
                   Model.Drivers, 
                   new { @id = "driverDropDown", @class = " form-control chosen-search" })
          </div>
     </div>
</div>

@Html.DropDownListFor(
model=>model.DriverId，
模特，司机，
新的{@id=“driverDropDown”，@class=“表单控制选择搜索”}）

你好，拉文杜·萨鲁瓦达纳

你试过这个吗？解决方案

@Html.DropDownListFor（x=>
x、 股票代码，
（IEnumerable）ViewBag.AllStockList，
新的
{
@class=“表单控件选择器选择器”，
@Value=@Model.Description，
onchange=“this.form.submit（）；”，
数据\u显示\u subtext=“true”，
数据\u实时\u搜索=“真实”
})

函数myFunction（）{
document.getElementById（“myDropdown”）.classList.toggle（“show”）；
}
函数filterFunction（）{
var输入、滤波器、ul、li、a、i；
输入=document.getElementById（“myInput”）；
filter=input.value.toUpperCase（）；
div=document.getElementById（“myDropdown”）；
a=div.getElementsByTagName（“a”）；
对于（i=0；i-1）{
a[i].style.display=“”；
}否则{
a[i].style.display=“无”；
}
}
}

.dropbtn{
背景色：#4CAF50；
颜色：白色；
填充：16px；
字体大小：16px；
边界：无；
光标：指针；
}
.dropbtn:悬停，.dropbtn:焦点{
背景色：#3e8e41；
}
#我的输入{
边框框：框大小；
背景图片：url（'searchicon.png'）；
背景位置：14px 12px；
背景重复：无重复；
字体大小：16px；
填充：14px 20px 12px 45px；
边界：无；
边框底部：1px实心#ddd；
}
#myInput:focus{outline:3px solid#ddd；}
.下拉列表{
位置：相对位置；
显示：内联块；
}
.下拉内容{
显示：无；
位置：绝对位置；
背景色：#f6f6f6；
最小宽度：230px；
溢出：自动；
边框：1px实心#ddd；
z指数：1；
}
.下拉内容a{
颜色：黑色；
填充：12px 16px；
文字装饰：无；
显示：块；
}
.下拉列表a:悬停{背景色：#ddd；}
.show{display:block；}

下拉列表

您可以使用第三方插件，该插件允许多个下拉列表，例如具有新样式的multiselect，还可以进行搜索

使用此SELECT2下拉插件

---

在下拉列表中使用此功能-数据\u live\u search=“true”

要使用该功能，您必须使用以下脚本-

1.bootstrap-select.min.js
2.boostrap-select.min.css

你可以从这里下载这些文件-

范例-

<div class="col-md-8">
    <div class="dropdown">
         <div class="chzn-dd-width">
              @Html.DropDownListFor(
                model => model.DriverId, 
               Model.Drivers, 
               new { @id = "driverDropDown", @class = " form-control chosen-search" ,data_live_search="true"})
      </div>
 </div>

@Html.DropDownListFor(
model=>model.DriverId，
模特，司机，
新的{@id=“driverDropDown”，@class=“表单控制选择搜索”，数据\u live\u search=“true”}）

---

我希望它能帮助您。

我想这是因为使用了asp.net mvc。

<div class="col-md-8">
    <div class="dropdown">
         <div class="chzn-dd-width">
              @Html.DropDownListFor(
                model => model.DriverId, 
               Model.Drivers, 
               new { @id = "driverDropDown", @class = " form-control chosen-search" ,data_live_search="true"})
      </div>
 </div>