Флажок simple_form с ботстрапом

Я использую simple_form с Bootstrap, и я хочу, чтобы мой флажок "Запомнить меня" был встроен слева от метки, как в тегах Twitter Bootstrap: http://twitter.github.com/bootstrap/base-css.html#forms

Мой код формы выглядит следующим образом:

<%= simple_form_for(resource, :as => resource_name, :url => session_path(resource_name), :html => { :class => 'well'}) do |f| %>
    <%= f.input :email %>
    <%= f.input :password %>
    <%= f.input :remember_me, :as => :boolean if devise_mapping.rememberable?  %>

    <%= f.button :submit, "Sign In" %>

<% end %>

В результате флажок "Запомнить меня" поверх флажка.

Что я испортил?

Ответы

Ответ 1

Здесь есть несколько вариантов, см. здесь для них:

Наиболее простым (я думаю) является использование :label => false и :inline_label => true в вашем флажке для изменения того, где в HTML помещается метка.

<%= f.input :remember_me, :as => :boolean, :label => false, :inline_label => true if devise_mapping.rememberable? %>

Это создает для меня что-то подобное:

enter image description here

Ответ 2

Ответ на @alol отлично подходит для вертикальной формы (надписи поверх полей), но если вы делаете горизонтальную форму и хотите, чтобы метки флажков отображались справа от флажка, но все же сохраняйте расположение формы, вы можете сделать это:

f.input :remember_me, :as => :boolean, :label => "&nbsp;", :inline_label => true if devise_mapping.rememberable?

Вы также можете передать конкретную метку для использования в качестве встроенной метки вместо true, если вам нужно:

f.input :remember_me, :as => :boolean, :label => "&nbsp;", :inline_label => "My Label" if devise_mapping.rememberable?

Ответ 3

Я думаю, что это немного проще:

f.input :remember_me, wrapper: :vertical_boolean, as: :boolean  if devise_mapping.rememberable?

Обертка поставляется в config/initializers/simple_form_bootstrap.rb по меньшей мере из simple_form 3.1.0rc2 при установке с помощью:

rails g simple_form:install --bootstrap