如何在Rails表单中保持同一行的复选框和标签？

Question

如何将复选框的标签与包含表单的rails视图中的复选框保持在同一行？

目前标签在下一行:

<div class="span6 offset3">
<%= form_for(@user) do |f| %>
<%= render 'shared/error_messages', object: f.object %>

  <%= f.label :name %>
  <%= f.text_field :name %>

  <br>
  <%= f.check_box :terms_of_service %>
  <%= f.label :terms_of_service, "I agree to the #{link_to 'Terms of Service', policies_path}.".html_safe %>
  <br><br>

  <%= f.submit "Create my account", :class => "btn btn-large btn-primary" %>
<% end %>

谢谢你,亚历山德拉

Answer 1

根据bootstrap wiki,它一定是

<label class="checkbox">
  <input type="checkbox"> Check me out
</label>

在Ruby on Rails中是哪个

<%= f.label :terms_of_service do %>
  <%= f.check_box :terms_of_service %>
  I agree to the <%= link_to 'Terms of Service', policies_path %>.
<% end %>

Answer 2

看起来您正在使用Bootstrap,因此我建议您调整视图代码以使用Bootstrap文档的此部分中描述的水平表单布局:http://getbootstrap.com/css/#forms

Answer 3

 <br>
  <%= f.check_box :terms_of_service, :style => "float:left;" %>
  <%= f.label :terms_of_service, "I agree to the #{link_to 'Terms of Service', policies_path}.".html_safe, :style => "float:left;" %>
  <br>

Answer 4

对答案的评论是正确的,但它假设了一些关于元素顺序的细微差别.

正确答案如下:

<%= f.check_box :terms_of_service %>
<%= f.label :terms_of_service, "I agree to the #{link_to 'Terms of Service', policies_path}.".html_safe
                             , {class: "checkbox inline"} %>

有两件事是必要的:

1. 标签元素上的类
2. checkbox元素必须位于label元素之前.

一旦你看到它工作,这是显而易见的,但form_for的所有其他样本总是在标签后面有输入,你需要更改为复选框.