Javascript ASP MVC引导-为显示重复框选择2 DropDownList

我有一个ASP.NETMVC项目。我所有的DropDownListFor都显示为2个框，而不是1个框。这是当前视图的外观：

视图应该是这样的：

以下是视图中的代码：

   <div class="col-xs-12 col-sm-6 col-md-4 ">
        <div class="form-group select-280">
            @Html.LabelFor(model => model.HoleID)
            <br />
            @Html.DropDownListFor(model => model.HoleID, (List<SelectListItem>)ViewData["HoleList"], new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.HoleID)
       </div>
   </div>

为什么我所有的DropDownListFor都显示为副本，我如何纠正这个错误

编辑

---

删除.select2修复了错误并删除了重复的下拉列表。。。然而，这使得剩下的下拉列表无法搜索。如何在保持搜索功能的同时修复此问题？

我在使用剑道时体验过这一点，它围绕着表单控件。问题是下拉列表被转换成更具动态性的内容；最初的SELECT元素实际上可能隐藏在UI中。Select2可能使用多个元素来表示select，原始表单控件类应用于这两个元素，并强制它们显示，而不是显示和隐藏。或者表单控件类强制显示原始select

我不得不停止使用表单控件，然后为剑道控件创建一个特殊类，以避免其中一个元素始终显示

---

解决问题的方法是检查标记。您将看到表单控件类被传递到内部元素。

这是通过Visual Studio发布过程确定的服务器错误。引导select2文件在服务器中不正确。

请尝试删除LabelFor@ishanjoshi那是行不通的。其他建议？为什么需要放入$HoleID.select2；作为类应用于中的select2razor@ishanjoshi你能告诉我怎么做吗？您是否在class=form control的内部？@Html.DropDownListFormodel=>model.HoleID，ListViewData[HoleList]，new{@class=form control select2}删除表单控件不会删除第二个框。检查标记后，根据我的经验，我可以看到顶部框是一个Select，底部框是一个span，虽然我没有使用select2，但通常情况下，Select元素会被隐藏。您确实无法设置它的样式，但会将其保留在DOM中，以便在回发时显示选定的值。然后，它创建另一个元素来显示时尚下拉列表。如果两者都在显示，则很可能出现问题。。。。。。。。

$(document).ready(function () {

    $("#HoleID").select2();

}