2012-02-28 8 views
5

mediante el uso de la simple_form por defecto 2 envoltorio, que genera un margen de beneficio que tiene este aspecto:SimpleForm 2: etiquetas de entrada dentro de un envoltorio

<div class="..."> 
    <label>...</label> 
    <input ... /> 
</div> 

me gustaría obtener un margen de beneficio en el que la etiqueta de entrada es a su vez en el interior un contenedor como este:

<div class="..."> 
    <label>...</label> 
    <div class="..."> 
    <input ... /> 
    </div> 
</div> 

¿Tengo que crear un componente personalizado para este comportamiento?

Gracias.

Nicolas.

Respuesta

7

mira esto:

La API envoltorio todavía no está bien documentada, pero he pasado algún tiempo tratando de averiguarlo. Aquí hay un ejemplo simple, que se puede configurar dentro del inicializador simple_form.

# Use this setup block to configure all options available in SimpleForm. 
SimpleForm.setup do |config| 
    # Wrappers are used by the form builder to generate a complete input. 
    # You can remove any component from the wrapper, change the order or even 
    # add your own to the stack. The options given to the wrappers method 
    # are used to wrap the whole input (if any exists). 

    config.wrappers :GIVE_YOUR_WRAPPER_A_NAME, :class => 'clearfix', :error_class => nil do |b| 
    b.use :placeholder 
    b.use :label 
    b.use :tag => 'div', :class => 'WHATEVER_YOU_WANT_TO_CALL_IT' do |ba| 
     ba.use :input 
     ba.use :error, :tag => :span, :class => :'help-inline' 
     ba.use :hint, :tag => :span, :class => :'help-block' 
    end 
    end 
end 

Entonces, cuando se crea un formulario simplemente especificar el reiniciador que desea utilizar:

<%= simple_form_for @user, wrapper: 'WHATEVER_YOU_CALLED_YOUR_WRAPPER' do |form| %> 
<%end%> 

Espero que esto ayude.

+0

eso fue todo! No sabía que puede definir explícitamente "use: input" para controlar la posición de la etiqueta de entrada. Esto debe escribirse en el documento. ¡Estupendo! –

Cuestiones relacionadas