带有Bootstrap的simple_form复选框

我正在使用带有Bootstrap的simple_form，我希望我的“记住我”复选框位于标签的左侧，如Twitter Bootstrap文档中所示： http ： //twitter.github.com/bootstrap/base- css.html＃forms

我的表单代码如下所示：

 resource_name, :url => session_path(resource_name), :html => { :class => 'well'}) do |f| %>    :boolean if devise_mapping.rememberable? %>   

结果是复选框顶部的“记住我”标签。

我搞砸了什么？

Answer 1

有很多选项，请参阅此处了解更多信息：

最简单的（我认为）是使用:label => false和:inline_label => true ，在您的复选框上，更改标签放置在HTML中的位置。

<%= f.input :remember_me, :as => :boolean, :label => false, :inline_label => true if devise_mapping.rememberable? %>

这为我产生了这样的东西：

Answer 2

@ alol的答案适用于垂直表单（字段顶部的标签），但如果您正在进行水平表单，并且您希望复选框标签显示在复选框的右侧，但仍保持布局表格，你可以这样做：

 f.input :remember_me, :as => :boolean, :label => " ", :inline_label => true if devise_mapping.rememberable? 

如果需要，您还可以传递特定标签以用作内联标签而不是true ：

 f.input :remember_me, :as => :boolean, :label => " ", :inline_label => "My Label" if devise_mapping.rememberable? 

Answer 3

我觉得这个有点简单：

 f.input :remember_me, wrapper: :vertical_boolean, as: :boolean if devise_mapping.rememberable? 

当安装时，包装器至少从simple_form 3.1.0rc2捆绑在config/initializers/simple_form_bootstrap.rb中：

 rails g simple_form:install --bootstrap