我正在使用Rails 4和Simple Form with Bootstrap。
我希望我的复选框不会那样:
<%= c.input :my_bool_field, label: false, class: "form-control" %>
但是那样的东西(我有CSS)
<label class="switch switch-primary">
<input type="checkbox" />
<span></span>
</label>
我知道我可以使用simple_form包装器,但我发现它们有点令人困惑。有人可以帮助我创建带有该样式的复选框吗?
我发现这个项目非常有用和完整。它基于twitter bootstrap:http://www.bootstraptoggle.com/
有一个嵌入它的rails gem:
把复选框放在里面
<label class="switch switch-primary">
<%= f.input_field :my_bool_field, label: false, as: :boolean, class: 'form-control' %>
<span></span>
</label>
查看在https://github.com/abpetkov/switchery发现的Rails Switchery gem
轻松自定义bootstrap和ios样式开关,无需通过初始化程序或在视图中调用jquery函数来尝试更改simpleforms预构建的包装器。
您可以转到此链接并查看“开关”。 getbootstrap.com
我希望这个例子能为你服务,我目前正在使用Bootstrap 4.3和Rails 5.2;
使用模型形式的“自定义开关”及其工作方式:
- model / _form.html.erb
<%= form_with(model: employee, local: true) do |form| %>
<div class="custom-control custom-switch">
<%= form.check_box :active, class: "custom-control-input", id: "customSwitch1" %>
<label class="custom-control-label" for="customSwitch1">Status: </label>
</div>
<div class="actions">
<%= form.submit %>
</div>
<% end %>
我希望能帮到你,我是Rails和Bootstrap的新手。
问候!