formulario simple bootstrap horizontal y en línea

Question

Estoy trabajando con simple_form + bootstrap, pero quería saber si era posible hacer que algunos de los campos se pusieran en línea y otros debajo de la etiqueta en la misma forma.

Me gustaría incluso hacer un formulario en dos columnas o más.

¿Hay alguna forma de lograr esto a través de envoltorios o quizás a través de un generador de formas diferente o un diseño diferente?

¡Gracias!

Answer 1

La solución que he encontrado incluye el uso de las clases 'row' y 'span' proporcionadas por bootstrap e insertarlas en varios campos usando 'wrapper_html' proporcionado de forma simple.

Ejemplo:

.container 
    ... 
    = simple_form_for(@stuff, :html => { :class => 'form-horizontal' }) do |f| 
     = f.error_notification 

     .form-inputs.row 
     = f.input :name, :wrapper_html => { :class => 'span6' } 
     = f.input :contact_name, :wrapper_html => { :class => 'span6' } 

     .form-inputs.row 
     = f.input :contact_email, :wrapper_html => { :class => 'span6' } 
     = f.input :contact_phone, :as => :string, :wrapper_html => { :class => 'span6' } 

Usted puede leer en la documentación sobre el sistema de red sin ayuda de nadie: http://twitter.github.com/bootstrap/scaffolding.html

O echa un vistazo a algunos ejemplos de arranque y simple integración de formularios: http://simple-form-bootstrap.plataformatec.com.br/articles/new

Esperanza ¡eso ayuda!

Answer 2

Siempre puede organizar los campos según su gusto modificando el estilo de los elementos del formulario. Consulte cualquiera de los resultados de búsqueda de Google de 2 diseños de columna. Por ejemplo: this

Answer 3

También puede agregar el campo a la envoltura (trabajó para mí):

.container 
    ... 
    = simple_form_for(@stuff, :html => { :class => 'form-horizontal' }) do |f| 
     = f.error_notification 

     = f.input :postal_code, :label => 'Postal code, house number', :wrapper => :append do 
     = f.input_field :postal_code 
     = f.input_field :street_number