jQuery File Upload Plugin With Drag ‘n’ Drop Support


jQuery File Upload is a plugin for the popular JavaScript framework that helps handling file uploads.

The plugin is based on open standards like HTML5-JavaScript and doesn't use Flash. For legacy browsers it falls back to an Ajaxed-like iframe-PHP solution.

jQuery Drag Drop File Upload

Multiple files can be selected, they can even be drag 'n' dropped from the desktop and the upload process can start automatically or with an event (like clicking the "upload" button).

A progress bar can display the status and uploads can be canceled anytime.

It is possible to use multiple instances of the plugin in the same page and jQuery File Upload is compatible with any server-side application platform.

  • Rudy

    This is AWESOME!!!!!! Best upload script ever seen!!!

  • Could this be integrated with Amazon S3? Does it upload each file with one submission, or does it do each asynchronously? Looks like it might do each asynchronously seeings as how you can cancel specific uploads.

  • Si

    I would also like to know if it supports Amazon S3

  • Very nice! I’ve been wanting to develop a multiple file uploader like this for a while now but it was a daunting task. Thank you thank you.

    Easy Amazon S3 integration would be awesome, but there’s probably a PHP script for this out there somewhere…

  • Josh

    Am I missing something. How do you get this script to work? It’s like the download files are missing something.

  • Aneeq

    The code to upload file in PHP is very simple, but we need to understand the flow which is a below.

    1. Browse the file from a local system
    2. Upload to server
    3. Server keeps it on a temporary path
    5. Copy from temporary to permanent path

    Create a file upload form



    * An enctype attribute of the tag has been specified.
    * This attribute specifies which content-type to use when submitting the form
    * We have used “multipart/form-data” to upload binary data, like the contents of a file, to be uploaded
    * If proper enctype is not provided, upload will not work.
    * File upload is a huge security risk so you must check what type of files are being uploade

    Create a file upload script (upload-file.php)

    This will upload the file to the specified path.


    * The default file upload size using a browser is usually 2MB so files larger than this size may not upload. You will have to alter the file upload setting on the server.
    * You need to set write permission to the folder where file needs to be upload.
    * In our case, the “uploads” folder needs to have a 777 permission on a linux/unix server.





  • Evan

    Just wondering CAN this work with something really old like IE7? or 8? If it’s HTML 5 based I hope I’m not SOL