如何使用 form_for 和 collection_check_boxes 插入换行符

How to insert new line breaks using form_for with collection_check_boxes

我在我的代码中的某个位置使用了以下 form_for 来显示用户 select 来自的一系列主题。

 <%= form_for @user do |f| %> 
 <%= f.collection_check_boxes(:topic_ids, Topic.all.sample(50).each, :id, :topic_name) %> 
 <%= f.submit %>
 <% end %>

当它呈现在页面上时,这些框都是一个接一个的。如何将它们分开,以便每行有一个复选框?

来自 reference here 可以通过从上面的代码中为方法提供一个块来自定义元素的显示方式,如下面的示例

<%= form_for @user do |f| %> 
 <%= f.collection_check_boxes :topic_ids, Topic.all.sample(50).each, :id, :topic_name do |b| %> 
   <%= b.label(class: "check_box") do %>
     <%= b.check_box(class: "check_box") %>
     <%= b.object.topic_name %></br>
   <% end %>
 <% end %> 
 <%= f.submit %>
<% end %>

您当然可以在块内渲染 HTML:

   <%= form_for @user do |f| %> 
      <%= f.collection_check_boxes :topic_ids, Topic.all.sample(50).each, :id, : topic_name do |b| %>
      <div  class="my-checkbox-wrapper">
        <%= b.label(class: "foo") do %>
          <%= b.object.topic_name %>
          <%= b.check_box(class: "bar") ></br>
       <%end%>
       <%= f.submit %>
    <%end%>

你可以看看这个example

这是一个非常宽泛的问题。简而言之,使用 CSS.

例如使用Bootstrap 4:

<%= form_for @user do |f| %>
<div class="form-check">
  <%= f.collection_check_boxes :topic_ids, Topic.all.sample(50).each, :id, :topic_name, class: 'form-check-input' %>
</div>
<%= f.submit %>
<% end %>