20 jQuery File Upload Plugins | Learning jQuery

jQuery File Upload plugins enable you to upload files, images, videos, and other type of documents to your websites and web applications. Adding file upload feature to your website isn’t arduous task and can be easily accomplished with the help of jQuery File Upload Plugins.

In this article we would like to present 20 Best jQuery File Upload Plugins that will help you to add file upload feature to your websites and deliver your visitors a better user friendly interface and experience. If you are aware of some other useful file upload plugins, please do share with us by posting a comment below, we would love to hear your feedback. Enjoy !!

1. jQuery File Upload

File Upload widget with multiple file selection, drag&drop support, progress bars and preview images for jQuery. Supports cross-domain, chunked and resumable file uploads and client-side image resizing. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads.

2. Dropzone.js

Dropzone.js is a light weight JavaScript library that turns an HTML element into a dropzone. This means that a user can drag and drop a file onto it, and the file gets uploaded to the server via AJAX.

3. Uploadify

Uploadify™ is a jQuery plugin that allows you to easily add multiple file upload functionality to your website. Two distinct versions (HTML5 and Flash) allow you the flexiblity to choose the right implementation for your site and fallback methods make it degrade gracefully.

4. FileAPI

jQuery.FileAPI is a jQuery plugin for FileAPI (multiupload, image upload, crop, resize and etc.).

5. jQuery HTML5 Uploader

jQuery HTML5 Uploader is a lightweight jQuery plugin that lets you to quickly add an upload system a-la-Gmail into your web app. You only need to create a dropbox element (i.e. a div) and jQuery HTML5 Uploader will do the rest. Then you can drag & drop one or more files on the element and the files will be uploaded. It also works with the multiple input file element.

6. jQuery Upload File

jQuery Upload File plugin provides multiple file uploads with progress bar.Works with any server-side platform (Google App Engine, PHP, Python, Ruby on Rails, Java, etc.) that supports standard HTML form file uploads.

7. JSAjaxFIleUploader

JSAjaxFileUploader is a jQuery Plugin with ease of use. Fully customizable with many options. You can have multiple upload forms in a same web page at the same time and user can also select multiple files for upload.

8. jQuery File Uploader

JQuery plugin to drag and drop files, including ajax upload and progress bar. The idea for this plugin is to keep it very simple; other options/plugins i found mess up a lot with the markup and provide some really ‘hacky’ ways to make it available for prehistoric browsers.

9. Resumable.js

Resumable.js is a JavaScript library providing multiple simultaneous, stable and resumable uploads via the HTML5 File API.
The library is designed to introduce fault-tolerance into the upload of large files through HTTP. It allows for users to pause, resume and even recover uploads without losing state.

10. Dropper

A jQuery plugin for simple drag and drop uploads.

11. jQuery.filter

jQuery.filer is a simple HTML5 File Uploader, a plugin tool for jQuery which change completely File Input and make it with multiple file selection, drag&drop support, different validations, thumbnails, icons, instant upload, print-screen upload and many other features and options.

12. Drop Area

Droparea is a HTML5 drag and drop image file uploader jQuery plug-in and a php script for server-side. Simply drag the image file into the specified area, the image will be automatically uploaded to your server.

13. Lite Uploader

LiteUploader is a simple and light wait jquery file upload plugin. It is using new HTML 5 to make uploading files an easy task. It also have good inbuilt configuration options..

14. Multiple File Upload

This jQuery Multiple File Upload Plugin ($.MultiFile) is a non-obstrusive plugin for jQuery that helps users easily select multiple files for upload quickly and easily on your server whilst also providing some basic validation functionality to help developers idenfity simple errors, without having to submit the form (ie.: upload files).

15. Picture Cut

picture cut is a jquery plugin that handles images in a very friendly and simple way, with a beautiful interface based on bootstrap or jquery ui, has great features like ajax upload, drag image from explorer, image crop and others.

16. Fine Uploader

Fine Uploader aims to make file-uploading on the web possible in every browser and mobile device. It is cross-browser, dependency-free, and 100% Javascript. FineUploader is simple to use. You only need to include one JavaScript file. There are absolutely no other dependencies.

17. FileDrop.js

FileDrop is a lightweight JavaScript class for easy-to-use file uploading that works out of the box.Self-contained cross-browser pure JavaScript class for Drag & Drop and AJAX (multi) file upload.

18. PlupUpload

Plupload allows you to upload files using HTML5 Gears, Silverlight, Flash, BrowserPlus or normal forms, providing some unique features such as upload progress, image resizing and chunked uploads.
The developers of TinyMCE brings you Plupload, a highly usable upload handler for your Content Management Systems or similar.

19. Peak Upload

PekeUpload is a best jquery file upload plugins which support single file upload and multiple file upload functionality. Which have good customisable Bootstrap Theme, real time Progress Indicators and much more.

20. Closify

Closify is a jQuery based plugin, that simplifies the developers task to create a dynamic image uploader. With closify you can easily create any kind of image convas (cover, profile, or custom banner) with whatever size you define, and intelligently enough the Closify plugin would resize the image according to the size of container you defined with a respect of the image aspect ratio, and then it start to generate a dynamic widget that give you the capability to position/reposition your photo adequately; save the photo with the desired position and submit the position information to the server side for storage; change the photo you have chosen and just delete the selected photo.