在 Rails 中使用物化 css 框架和简单表单时，不会出现复选框答案

【问题标题】：Checkbox won't appear, when using materialize css framework and simple form in rails在 Rails 中使用物化 css 框架和简单表单时，不会出现复选框
【发布时间】：2016-04-08 23:29:11
【问题描述】：

我已经找到了解决问题的方法。只是想与他人分享。

所以，我正在编写一个 Rails 应用程序，它使用简单的表单来生成表单，并且样式由物化 css 框架控制。

我遇到的第一个问题是让简单的表单输出带有类型复选框的输入标签作为布尔值。检查他们的文档后，这是我的解决方案：

f.input :delivery_check, as: :boolean, label: "Check if order was delivered"

然而，虽然简单的表单输出带有类型复选框的输入标签，但只有该框的标签出现在视图中。

【问题讨论】：

标签： ruby-on-rails checkbox simple-form materialize

【解决方案1】：

这是我的工作解决方案：

首先，阅读 materialize 网站上的代码示例。输入标签需要出现在标签标签之前。所以我们需要以简单的形式自定义我们自己的包装器。

因此，在您的 config/initializers 目录中，应该有一个 simple_form.rb（或者如果您初始化了 simple_form_bootstrap.rb）

像这样添加你的包装器

config.wrappers "my_checkbox", tag: 'div', class: "col s4", error_class: 'has-error' do |b|
  b.use :input
  b.use :label
  b.use :error, wrap_with: { tag: 'span', class: 'help-block' }
  b.use :hint,  wrap_with: { tag: 'p', class: 'help-block' }
end

现在，在您调用简单表单输入助手的视图模板中，您应该省略 as::boolean 选项，并通过 input_html 传入类型（否则会生成两组复选框输入标签）

f.input :delivery_check, :input_html => { :type => "checkbox", :id => "delivery_check" }, wrapper: :my_checkbox, label: "Check if order was delivered"

这只是一个简单的问题，让我陷入了相当长的一段时间。希望它能帮助其他有类似问题的人。

【讨论】：