CODEWITHSUNDEEP
ruby-on-railssimple-form
Jorge Sampayo
Jorge Sampayo

Reputation: 868

How can I surround inputs with a div in simple_form without surrounding their respective label (with f.input)

I'm using a custom theme for twitter bootstrap that surrounds the inputs in a div this way:

    = simple_form_for(@user_session) do |f|
      .control-group
        = f.label :username, 'Usuario', class: 'control-label'
        .controls
          = f.input_field :username

I want to use only f.input to save coding in large forms, I ran rails generate simple_form:install to be able to modify the configuration, currently I have:

    = simple_form_for(@user_session) do |f|
      = f.input :username, :label => 'Usuario'

And it generates almost all the markup I need (adding the respective classes in initializers/simple_form):

<form action="/user_sessions" class="form-horizontal new_user_session" method="post">
      ...
      <div class="control-group username">
          <label class="username control-label" for="user_session_username">Usuario</label>
          <input class="username" id="user_session_username" name="user_session[username]" size="50" type="text" />
      </div>
      ...
</form>

It only needs and extra 'div' with the class 'controls' surrounding the input tag but not the label, is there any way to achieve this?

Thanks!

Upvotes: 3

Views: 3930

Answers (1)

Jorge Sampayo
Jorge Sampayo

Reputation: 868

Finally found how to do it, configuring the wrapper this way adds the required div for bootstrap:

initializers/simple_form

config.wrappers :bootstrap, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
  b.use :html5
  b.use :placeholder
  b.use :label
  b.wrapper :tag => 'div', :class => 'controls' do |ba|
    ba.use :input
    ba.use :error, :wrap_with => { :tag => 'span', :class => 'help-inline' }
    ba.use :hint,  :wrap_with => { :tag => 'p', :class => 'help-block' }
  end
end

config.default_wrapper = :bootstrap

Found the answer here: http://blog.jamesalmond.com/using-simple-form-in-an-engine/

Hope it helps someone! See ya.

Upvotes: 8

Related Questions