I've successfully uploaded a file using PUT and html, but is there a way to upload a file in a ajax remote_form_for ?
I've tried this to no success:
<% remote_form_for #song,:html => { :multipart => true }, :url => { :action => 'upload' } do |f| %>
If you're using Rails 3, try the Remotipart gem. It makes AJAX style file uploads relatively painless.
http://rubygems.org/gems/remotipart
http://github.com/leppert/remotipart
The standard remote_form_for doesn’t understand multipart form submission so you can't actually do this without some leg-work as indicated by yoda above.
The other way to achieve this is by using an iframe.
Related
I'm new to the topic of AJAX and I want to AJAX this file upload in rails. It's a nested file upload so be wary. When a photo is uploaded I just want it to show the photo and have a delete link.
I tried to follow the railscast on the topic but it didn't talk about file upload and was a little confusing. So ANY sort of advice would be awesome!
new product page(HAML)
= form_for #product,:url => products_path, :html => { :multipart => true } do |f|
-
You may want to take a look at this, http://blueimp.github.io/jQuery-File-Upload/
Im in the process of converting my rails code which developed in version 2 to rails 3. Earlier I used link_to_remote function to create a link.In that I displayed the page on a div field using ':update' option.
<%= link_to_remote #processes_tree[x]["name"],:update => "toprightdiv", :url => { :action => "editproduct", :id => #processes_tree[x]["id"]}%>
Now In rails the link_to_remote is not available ,So I used link_to.But in it the :update option is not available.So I am not able to show the page in the div field.When ever I click the link a new page getting displayed for the link.Is there any alternative way available i n rails3.Please help me to solve the issue.
This is a very general question regarding unobtrusive javascript in rails (googling that phrase would get all you need to know).
Generally you need to use link_to and set :remote to true. Then do the update by handling the response in a .js view or equivalent.
You may also benefit from this screencast demonstrating the rationale for the change:
http://railscasts.com/episodes/205-unobtrusive-javascript
The :update option isn't supported by the new link_to :remote => true.
You will either have to
use the legacy plugin
write the JS/AJAX yourself instead of using :remote => true
use render :update { |page| p.replace_html ... }
form_for #model, :remote => true, :html => {:multipart => true } does not allow us to send file via ajax.
I have found this but it's not up to date and it relies on dependancies :
http://khamsouk.souvanlasy.com/articles/ajax-file-uploads-in-rails-using-attachment_fu-and-responds_to_parent
http://www.williambharding.com/blog/rails/rails-ajax-image-uploading-made-simple-with-jquery/
Anyone with up to date ressources ?
This is example for uploading File on Rails 3 using Jquery.
Make use of it, it is simple
https://github.com/blueimp/jQuery-File-Upload/wiki/jQuery-File-Upload-for-Rails-3
I've used Uploadify in a recent application http://www.uploadify.com/ Some Rails specific notes here http://railstips.org/blog/archives/2009/07/21/uploadify-and-rails23/ I know you said Rails 3, but the concepts are the same.
I'm trying to generate a PDF file using AJAX call in Rails3. The following code generates a PDF file which I have created using PRAWN gem.
<%= link_to "Generate pdf", books_path(#book, :format => 'pdf') %>
I do not want user to view the PDF until they order it. So, the goal is to create a PDF file in the server.
Any ideas or thoughts much appreciated.
Use this, make sure your remote action does not return the PDF, but simple generates and stores it on the server.
link_to "Generate PDF", prepare_books_path(#book), :remote => true, :method => :put
This will work in Rails 3. If you're using jQuery, make sure to read this article on how to set things up correctly.
Your controller action may look like this:
def prepare
# Do your thing to generate the PDF
render :text => "PDF Generated", :status => 200
end
I used the PUT-method because you are altering the state of your data (e.g. you are generating something new, you don't want a bot or crawler to automatically call that).
Firstly, it beats me why you would do something on a request like generating a PDF, when the user is not expecting that action. Isn't better to only generate the pdf when the user requests for it?
Thanks Ariejan.
I modified your code as following and it did just what I wanted.
<%= link_to "Generate Story Book", pdfbook_stories_path(:format => 'pdf'), :remote => true %>
And for the controller,
def pdfbook
#stories = current_account.stories
respond_to do |format|
format.pdf {}
end
end
Is there any easy way how to handle AJAX file upload in Rails? e.g. with a plugin
If you're using Rails 3, I've written a plugin that makes AJAX style file uploads relatively trivial to implement.
http://rubygems.org/gems/remotipart
JQuery File Upload is very active and versatile file upload widget project.
See the demo here: http://blueimp.github.com/jQuery-File-Upload/
Here's a Gem: http://rubygems.org/gems/jquery.fileupload-rails
The wiki also has Rails examples: https://github.com/blueimp/jQuery-File-Upload/wiki
It's not really necessary to use some special plugins for that.
Easiest way to do ajax picture upload for me was just make form that uploading pictures to act like ajax. For that I use ajaxForm jQuery plugin: http://www.malsup.com/jquery/form/
Than return to js uploaded picture and put it to your page.
So, you should make your form be ajaxForm:
$('#uploader').ajaxForm({dataType: "script",
success: ajaxFormErrorHandler,
error: ajaxFormSuccessHandler
}
controler looks like that:
def add_photo
#photo = PhotosMeasurement.new(params[:user_photo])
respond_to do |format|
if #photo.save
format.json { render :json => #photo}
else
format.json { render :json => nil}
end
end
end
and in ajaxFormSuccessHandler you simply get picture object:
var photo = jQuery.parseJSON(responseText.responseText);
and put photo wherever you like:
target.find('.addPhoto').before(''+
'<input class="imageId" type="hidden" value='+photo.id+' > '+
'<img src='+photo.photo.thumb.url+' alt="Thumb_1"> ');
P.S: Don't really know why but if you return to ajaxForm handler something, it handle that request as ERROR not SUCCESS.
P.P.S: surely jQuery-File-Upload plugin makes more but if you don't need all that, you can use this way.
P.P.P.S: you should have already functional non-ajax file upload for do that =)
You can use Jquery Form
download jquery.form.min.js and put it to vendor/assets/javascripts folder
in your application.js
//= require jquery.form
in your view (haml sample):
= form_for user, authenticity_token: true, :multipart => true, id: 'user_form' do |f|
= f.label :avatar, t("user.avatar")
= f.file_field :avatar, accept: 'image/png,image/gif,image/jpeg'
= f.submit t(user.new_record? ? 'add' : 'update'),
class: 'btn btn-primary', data: {disable_with: t(user.new_record? ? 'adding' : 'updating')}
:javascript
$('#user_form').ajaxForm()
here is Rails app sample https://github.com/serghei-topor/ajax-file-upload-rails-sample