在Rails应用程序中使用带有simple_form的twitter bootstrap时，如何将下拉列表风格化？
我正在使用simple_form和twitter-bootstrap-rails gems。 每件事情都运行良好，但不知何故下拉不是通过twitter bootstrap rails设计风格..它显示像普通forms。
["one", "two", "three", "four"], :input_html => {:class => 'dropdown'}, :label => 'Send To', prompt: "Choose From List" %> DROPDOWN SHOWING图片：
在BOOTSTRAP中需要降落的图像
使用SimpleForm和Bootstrap获取风格化下拉列表的一种方法是使用Bootstrap-Select 。 它有一个Rails Gem ; 添加到您的Gemfile并执行一个bundle ：
gem 'bootstrap-select-rails'
您需要将其添加到样式表中
@import "bootstrap-select";
和Javascript。
//= require bootstrap-select
现在，您需要做的就是在现有的f.input使用input_html: {class: 'selectpicker'} ：
<%= f.input :category, :collection => ["one", "two", "three", "four"], :input_html => {:class => 'selectpicker'}, :label => 'Send To', prompt: "Choose From List" %>
然后初始化Javascript（无论你有多少个selectpickers都是一次性的）：
<%= javascript_tag "$('.selectpicker').selectpicker();" %>
重新启动您的应用程序，您的输入下拉列表应使用Bootstrap样式呈现。
一些可能有用的额外信息：您可以禁用提示项，以便通过向项添加disabled类来从下拉列表中选择它。 我找不到关于SimpleForm如何将样式应用于集合的一个元素的任何指导，但我想出了以下所有这些提示：
<%= javascript_tag "$('li[data-original-index=0]').addClass('disabled');" %>
更换
<%= f.input :category, :collection => ["one", "two", "three", "four"],:input_html => { :class => 'dropdown'}, :label => 'Send To', prompt: "Choose From List" %>
同
<%= f.input :category, :collection => ["one", "two", "three", "four"],:input_html => { :class => 'form-control'}, :label => 'Send To', prompt: "Choose From List" %>
.form-control用于设置选择标签的样式。 具有.form-control所有文本, 元素都设置为width：100％; 默认情况下。 在.form-group包装标签和控件以获得最佳间距。
dropdown不用于select标记。 详情请见此处