Here is one way of getting Paperclip to do a simulated Ajax upload,
and also displaying uploaded image in the current page. It uses the
method of targeting an iframe for the post, then uses
responds_to_parent plugin to update page with rjs.

The pieces used in test application:

+) Paperclip:   http://github.com/thoughtbot/paperclip

+) Gert Thiel's fork of  Tom's paperclip_with_hobo:

     http://github.com/GertThiel/paperclip_with_hobo/commit/3013fbd0eefdf2...

    Gert also has some good suggestions on setting up the form.

+) Mark Catley's responds_to_parent:  Necessary for the 'Ajaxy' upload
    and rjs part:

    http://github.com/markcatley/responds_to_parent

My example is based on a test application where there is a
Job class that has_one Photo,
and the Photo belongs_to the Job.  I am uploading
photo from a job page, then displaying it in the same page
using responds_to_parent.

Install the plugins, following guidelines from above references. Be
sure to put

<include src="paperclip" plugin="paperclip_with_hobo"/>

in your application.dryml.

Define your form:

<def tag="form" for="Photo">
        <form merge multipart param="default">
        <error-messages param/>
        <field-list  fields="myimg" param/>
        <div param="actions">
                <submit label="Save" param/>
        </div>
        </form>
</def>

...create instances in JobsController 'new'

    @job = Job.new
    @job.user = current_user
    @photo = @job.build_photo


Call to form:

<form target="jobdummy"  with="&@job.photo" action="/photos/
upload_main" >
         <field-list:  fields="myimg" />
 </form>

Div to be updated:

   <div id="photohere" part="photopart"><img src="temp.jpg" /></div>

Iframe targeted in form:

   <iframe id="jobdummy" name="jobdummy" style="width:0px;height:
0px;top:3000px"></iframe>

PhotosController method called by form:

    def upload_main
    @photo = Photo.find_by_job_id(params[:photo][:job_id])
    if @photo != nil  # this check done if multiple photos are saved
to the same record
       @photo.update_attributes(params[:photo])
    else
      @photo = Photo.new(params[:photo])
    end
    if  @photo.save
        responds_to_parent do
          render :action => 'jobPhoto.rjs'
        end
    end
  end

Content of jobPhoto.rjs, to update parent of <iframe> with image
that was just uploaded:

   page[:photohere].replace_html("<img src='#[email protected]}' />")

That's it, any comments on improving appreciated .

Cheers,

   Jet
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Hobo 
Users" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to 
[email protected]
For more options, visit this group at 
http://groups.google.com/group/hobousers?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to