Previewing an image after it has been submitted through AJAX (Rails solution)?

I'm trying to see what is the best way to implement a mechanism as in use here: https://sortfolio.com/signup . Essentially, one selects a picture to be uploaded. Picture uploads in the background and then it appea开发者_Go百科rs on the page with no refresh required.

So far I manage to do the POST of the image (I'm posting to an IFrame, using a jQuery plugin) and show the progress bat. I don't quite understand, when / how to pull the image back.

I'm using paperclip for processing.

Any thoughts ?

Thanks.

I did some time ago an example application for a similar problem. You can find it here. It renders the image on a modal window, but I'm quite sure you can find some ideas on how to solve your problem.

In your Rails controller, when responding to an AJAX request, send back the newly uploaded image URL, the entire image as a JSON object (w/ URL included), or the partial HTML to render the image.

For example, using the first method, use jQuery to set the src of the img.

Something like within the callback of the AJAX request:

$('#image').attr('src', /* url sent back from AJAX request */);