File upload without reload the page

It is impossible to upload a file using AJAX but we can upload a file without reload whole page.

How it is possible? Answer is using frame .

We need to use target elemet in form tag. By using target element we submittted form into that frame name of target.

1 2 3 4 5

<form target="test_frame" action="/test/upload" id="test_form" method="post" enctype="multipart/form-data">    <input type="file" name="file" /><br />    <input type="submit" /> form> <iframe id="test_frame" name="test_frame" style="display: none">iframe>

Now when you click on submit button, data will submitted to hidden frame and action will called and result will displayed into that frame.
So we will return the result to the parent window by using respond_to_parent.
You need to download this plugin from: Here
Implement below code in your controller

1 2 3 4 5 6 7 8 9 10

class TestController < ActionController::Base   def upload     # Do stuff with params[:file]     responds_to_parent do       render :update do |page|         page.replace_html 'test_form', :partial => 'test_form'       end     end   end end