如何在 simple_form 中制作 twitter bootstrap 兼容的复选框标签？

Question

我正在尝试为一个复选框获取两个标签，如 Twitter Bootstrap 文档中所述。 （见http://twitter.github.com/bootstrap/base-css.html#forms --> 水平表格 --> 复选框（在文本输入下方）

所以我想显示的是左侧描述的标签、复选框本身以及右侧旁边的提示。

simple_form gem 中的 twitter bootstrap 标准实现创建了一个 <p> 标签来显示提示，因为它试图对所有类型的输入保持一致。

我现在想在 simple_form 初始化程序中为“引导复选框”创建一个自定义包装器，但我就是不知道如何解决这个问题。

这是我目前使用裸轨 (erb) 实现它的方式：

<div class="control-group">
 <%= f.label :recurring, :class => 'control-label' %>
 <div class="controls">
   <%= f.label :recurring, :class => 'checkbox' do %>
    <%= f.check_box :recurring %>
    <%= t('.recurring_hint') %>
   <% end %>
 </div>
</div>

您能帮我或至少尝试解释一下这些自定义包装器的工作原理吗？谢谢！

编辑：让我更准确地问我的问题：我可以使用 simple_form 的包装器 API 来使用标签作为包装器吗？

Answer 1

使用latest simple_form，该选项开箱即用。

Answer 2

解决方案：

1. 更新到最新版本的 simple_form（2.0.2，有 2.0）
2. 覆盖布尔输入：

app/inputs/boolean_input.rb

class BooleanInput < SimpleForm::Inputs::BooleanInput
  def input
    if nested_boolean_style?
        template.label_tag(nil, :class => "checkbox") {
          build_check_box + inline_label
        }
    else
      build_check_box
    end
  end
end

_form.html.erb

调用模板：

<%= f.input :recurring, :inline_label => t('.recurring_hint') %>  

Answer 3

您可以使用引导支持安装 simple_form，因此您不需要编写控制组等包装器。

在安装时检查此链接： https://github.com/plataformatec/simple_form#twitter-bootstrap

你需要做的就是运行命令：

rails generate simple_form:install --bootstrap

在此页面中，您可以看到一些示例，包括带有 bootstrap 和 simple_form 的水平复选框：http://simple-form-bootstrap.plataformatec.com.br/articles/new

如果你真的想按你的方式使用它，你需要在标签上添加“内联”类以及“复选框”。