Nest Input Inside Label with Simple_Form and Rails 4

问题

I'm using Rails 4 and Simple_Form for an application, and for the front end layout I have to implement, I need to be able to have the input tag inside a label tag. The output needs to look like this:

<label class="input string optional profile_first_name">
    <input class="string optional" type="text" value="" name="profile[first_name]" id="profile_first_name">
</label>

I tried creating a custom wrapper that looked like this:

config.wrappers :custom_form, tag: 'div', class: 'form-group', error_class: 'has-error' do |b|
  b.use :html5
  b.use :placeholder
  b.optional :maxlength
  b.optional :pattern
  b.optional :min_max
  b.optional :readonly

  b.wrapper tag: 'label' do |ba|
   ba.use :input
   ba.use :error, wrap_with: { tag: 'span', class: 'help-block' }
   ba.use :hint,  wrap_with: { tag: 'p', class: 'help-block' }
  end
end

The issue I am running into is that the resulting html is missing the label text that Smart_Form usually generates. I am sure there has to be a way to correctly format the wrapper to display the input inside the label tag and for the label to still display, but I am at a loss. Thanks in advance!

回答1:

You should be able to simply insert ba.use :label_text wherever you want the label to appear.

b.wrapper tag: 'label' do |ba|
   ba.use :label_text
   ba.use :input
   ba.use :error, wrap_with: { tag: 'span', class: 'help-block' }
   ba.use :hint,  wrap_with: { tag: 'p', class: 'help-block' }
end

来源：https://stackoverflow.com/questions/34414520/nest-input-inside-label-with-simple-form-and-rails-4

标签

ruby-on-rails

simple-form