14

I am new to JQuery AJAX . I want to implement a file upload using a jquery. Will it be possible to make a fileupload with JQuery,AJAX and send it to Servlet which can use apache file commons to upload the file. Can anyone please advice me how to proceed further?

Thanks, Deepthi.

user200290
  • 193
  • 1
  • 3
  • 10

5 Answers5

12

Ajax in the traditional sense is XMLHttpRequest, which does not allow you encode and send local files to a server.

The common ways of doing uploading through "ajax" means, is to either use a Flash swf to handle the uploading on the same page, or to use a form that has a target of an invisible 1x1 iframe. You have some Javascript show a uploading spinner or whichever. After the file is uploaded, make the server return some Javascript to the iframe like

<script type="text/javascript">
top.MyProject.doneUploading();
</script>

top will allow you to call Javascript in the regular page. In order for that to work though, you must make sure the iframe has submitted to the same domain that the top document is located at.

seanmonstar
  • 11,284
  • 2
  • 21
  • 26
  • So this is why you don't typcially see pictures included in the signup info. like name, email, etc.. –  Jul 26 '11 at 21:12
  • @seanmonstar why doesn't Ajax in traditional sense allow you to do encode and send local files to a server . If you can send various other parameters to a server why can't you do it for file inputs ? – Geek Jul 30 '12 at 12:31
9

I had several problems using Uploadify so I turned to ajax upload

pedro
  • 411
  • 3
  • 9
3

Try Uploadify

Chris
  • 11,780
  • 13
  • 48
  • 70
Traveling Tech Guy
  • 27,194
  • 23
  • 111
  • 159
  • 1
    Yeah +1, I use it it's nice... that is all. – marcgg Dec 11 '09 at 15:02
  • 7
    Uplodify requires flash, which might not be suitable for some websites. – niaher Jan 07 '10 at 11:08
  • We wrapped Uploadify and the paid-for HTML 5 version (uploadifive) behind a jQuery extension, so that it could choose between them based on the browser capabilities. It works, but it was not much fun as the two APIs and templates were slightly different. – iCollect.it Ltd Jun 12 '14 at 17:32
0

This is not a jQuery solution but take a look at http://www.swfupload.org. I have used that component in the past to give the ajax / flickr like upload interface. Works great and is fairly easy to integrate into your site. There is a ton of demos at http://demo.swfupload.org too.

Jeff Widmer
  • 4,746
  • 6
  • 37
  • 51
0

I think jQuery Fileuploader Plugin is the best for that. Html5 api is now supported which do the drag and drop and multiple file select. It is platform independent and very easy to install.

http://pixelcone.com/fileuploader/

John Laniba
  • 435
  • 3
  • 12
  • It would be a great choice... if it had proper lincensing information. Without that, I would not recommend it. @John-Laniba , please, be so kind and update your project with it. – OpaCitiZen Jan 20 '12 at 15:58
  • I would LOVE to use it if it was easy to set up... just the process for it its annoying. – S.H. Mar 16 '14 at 00:10