2012-03-26 17 views
9

He estado usando Formtastic por un tiempo, y es genial para acelerar la implementación de formularios. Sin embargo, tengo un caso especial en el que necesito más personalización en lo que se muestra en mi formulario. Específicamente, el campo es un formulario de carga de archivos para cargar imágenes, y en el formulario de edición, quiero mostrar una miniatura de la versión actual de la imagen que se ha subido.¿Existe un mejor enfoque para esta entrada personalizada de Formtastic en Rails?

Desired Form Output

Tengo este trabajo, pero requería que utilizo el formato HTML personalizada, lo que significa que en cualquier momento Formtastic cambia el formato de salida, tengo que actualizar mi HTML correspondiente. Esto es lo que tengo en este momento:

<%= form.inputs do %> 
    <% if form.object.new_record? -%> 
     <%= form.input :image, :required => true, :hint => 'Maximum size of 3MB. JPG, GIF, PNG.' %> 
    <% else -%> 
     <li class="file input required" id="profile_image_input"> 
      <label class="label" for="profile_image">Image</label> 
      <%= image_tag form.object.image.url(:thumb), :class => 'attachment' %> 
      <%= form.file_field :image %> 
      <p class="inline-hints">Maximum size of 3MB. JPG, GIF, PNG.</p> 
     </li> 
    <% end -%> 
<% end %> 

Idealmente, sería bueno hacer algo más como el siguiente, donde input_html se supone que es el código HTML generado para la entrada, pista, etc .:

<%= form.inputs do %> 
    <%= form.input :image, :required => true, :hint => 'Maximum size of 3MB. JPG, GIF, PNG.' do |input_html| %> 
     <%= image_tag form.object.image.url(:thumb), :class => 'attachment' unless form.object.new_record? %> 
     <%= input_html %> 
    <% end %> 
<% end %> 

¿Algo como esto ya existe? ¿O hay otra opción similar que hará mi vida más fácil?

Respuesta

20

Bueno, yo mismo lo resolví por supuesto. Como siempre sucede cuando publico aquí. : P

Para cualquiera que desee hacer algo similar, he creado un tipo de entrada personalizado derivado de la entrada de archivos de Formtastic.

class AttachmentInput < Formtastic::Inputs::FileInput 
    def image_html_options 
    {:class => 'attachment'}.merge(options[:image_html] || {}) 
    end 

    def to_html 
    input_wrapping do 
     label_html << 
     image_html << 
     builder.file_field(method, input_html_options) 
    end 
    end 

protected 

    def image_html 
    return "".html_safe if builder.object.new_record? 

    url = case options[:image] 
    when Symbol 
     builder.object.send(options[:image]) 
    when Proc 
     options[:image].call(builder.object) 
    else 
     options[:image].to_s 
    end 

    builder.template.image_tag(url, image_html_options).html_safe 
    end 
end 

Ahora puedo simplemente crear una entrada de este tipo de la manera siguiente:

<%= form.input :image, :as => :attachment, 
         :required => true, 
         :hint => 'Maximum size of 3MB. JPG, GIF, PNG.', 
         :image => proc { |o| o.image.url(:thumb) } %> 

Opcionalmente, la etiqueta de :image puede aceptar uno de:

  • un Proc, que pasa el parámetro de objeto del formulario,
  • a Símbolo, que es un nombre de método en el objeto,
  • cualquier otra cosa, que se convierte en una cadena y se supone que representa la URL.

Además, puedo utilizar la opción :image_html para especificar clases HTML, ID, etc.

+4

Sí, se ve bien. Tengo muchas entradas personalizadas que hacen cosas como esta, o visualizo el valor como una cadena en una entrada deshabilitada. –

+3

Soy nuevo en editar/agregar código fuente. ¿Dónde pusiste la clase AttachmentInput? ¿Pusiste una clase en tu carpeta rails lib?¿Lo pones en la carpeta de entradas? Si está en la carpeta de entradas, ¿cómo maneja las diferentes versiones? ¿Qué pasaría si Justin actualizara la base de código? – ebbflowgo

+0

@ebbflowgo, pegué el código anterior en 'app/inputs/attachment_input.rb' y funciona. – ShadSterling

7

En la parte inferior de los documentos Formtastic en https://github.com/justinfrench/formtastic#modified--custom-inputs:

Create a file in app/inputs with a filename ending in _input.rb 

insuficiente para una solución completa , pero después de hurgar en la formidable fuente de inspiración pude encontrar lo siguiente que me está funcionando bien.

en app/entradas/label_input.rb:

class LabelInput 
    include Formtastic::Inputs::Base 

    def to_html 
     input_wrapping do 
      label_html << 
      "#{@object.send(method)}" 
     end 
    end 
    end 

se esté utilizando ActiveAdmin, en el formulario de la página:

form do |f| 
    f.inputs do 
    f.input :project 
    f.input :date_consumed 
    f.input :total_consumed 
    f.input :computed_waste, :as => :label 
    f.actions 
    end 
end 
Cuestiones relacionadas