html - 如何将 Bootstrap 下拉菜单应用到asp.net dropdownlist控件

Question

我有从数据库填充的下拉列表控件。我想对其应用 Bootstrap 下拉列表效果。我该怎么做。我尝试了form-control，但只有下拉控件发生了变化，而且它不像BS下拉菜单，列表与asp.net中的列表相同。

第二张图就是我想要的。第一个是我应用表单控件时得到的

代码:

  <asp:DropDownList ID="ddlCType" runat="server" CssClass="form-control" DataSourceID="SqlDataSource1" DataTextField="Comp_Type" DataValueField="Type_ID"  AutoPostBack="True" OnDataBound="DDLCTypeDataBound" Style="width: 400px">

Answer 1

Bootstrap 3 似乎无法从 asp.net 引擎渲染的 html 中选择“form-control”。所以这里有一些选项。

选项 1:在页面加载期间分配类。

<script>
    $().ready(function(){
    $('#<%=ddlCType.ClientID%>').addClass("form-control");
    });
</script>

选项 2::使用 bootstrap-select插入。

<asp:DropDownList ID="ddlCType" runat="server" CssClass="selectpicker" DataSourceID="SqlDataSource1" DataTextField="Comp_Type" DataValueField="Type_ID"  AutoPostBack="True" OnDataBound="DDLCTypeDataBound" Style="width: 400px">

<script>
$().ready(function(){
$('#<%=ddlCType.ClientID%>').selectpicker();
});
</script>

示例:http://jsfiddle.net/DinoMyte/wd1z0zmg/8/