How do i allow the user to select more than one file for upload?

Question

Gmail just released an update to their interface allowing the user to select more than one file for upload by using the CTRL-button. How do they do that? You can read about the new feature and see a screen shot here:

http://gmailblog.blogspot.com/2009/02/updates-to-attachments-multi-select-and.html

Answer 1

You will need to find flash-based sollution, like Google did with Gmail. You can try this jQuery plugin that offers exactly that: jQuery File Upload Plugin

Answer 2

Adobe Flash Player.

Here's a good library that I used: SWFUpload

Of course this is a JavaScript library, and not a jQuery plug-in, making it much more portable.

Answer 3

Take a look at RFC 1867 It defines how to upload files over HTTP using the multipart/mixed encoding. You can use the Apache Commons FileUpload library to do this in Java. I don't know how Google does it, but you can manage the multiple selects with JavaScript processing in your page.

Answer 4

Not the method Gmail uses, but the following link, combined with some jquery you can allow an unlimited number of files to be uploaded at the same time: Link

Answer 5

Google isn't using Flash, but actually some clever javascript (well, that IS what they're all about it seems :-) ). Using javascript and css, you can create a file chooser that lets the user select the file to upload. Then, you use a hidden iframe. The act of posting the form with your upload file targets the hidden iframe so that the result returned from the server on success goes into that hidden iframe. Using javascript, monitor the document body of that iframe to know when the file is uploaded.

This link appears to be a quick example of the basic concept: http://www.seemysites.net/projFolder/uploader/