Our free WordPress themes are downloaded over 2,500,000 times. Get them now!
Jquery File Upload Scripts

Top 17 Best Free jQuery File Upload Scripts For Multiple File Upload 2017

The web is built on a foundation of different file types. Whether it’s photographs, video content like movies, your personal Word documents, text documents, or programming oriented files, we are constantly changing and exchanging files with one another. It’s one of the main reasons why services like Dropbox exist, to help us manage and synchronize our files wherever we are. If you are a regular internet user, you will know the very importance of file sharing, and how crucial it can be to have access to reliable file sharing services in order to share our files in secure, convenient and effective ways.

If you are a web developer, you might be drawn towards the idea of building your own file sharing website, or perhaps you are looking to compliment an existing web design with a file sharing functionality that would let your customers or visitors to share their own files. There are many ways to look at it, but in order to even get that far, we need to find a reliable solution for uploading and managing files on behalf of ourselves, and behalf of others. This is why we have gathered a list of the most prominent and the best jQuery file upload scripts that you will be able to use for uploading and optimizing your files.

Because there are so many choices, we wish to mention that no choice is the best one, but instead one should closely investigate the end goal for each requirement, so if you are looking to create a personal file uploading script for uploading your personal files, then choose a more minimal uploading script, but if your agenda is to create a multi-functional file management website, take a look at the scripts that provide more extended functionality, you are sure to find a little bit of everything in our list here.

Closify

Closify

As we learned, content uploaders can serve many different purposes, and we begin our jQuery file uploader list with a perfect example to that statement. Closify is a jQuery image uploading and managing library that developers can use to manipulate images as soon as they are uploaded, whether for the purpose of a wallpaper website, to use for a personal community script that needs image resizing for community members, a standalone image management page for your own personal needs — with Closify you can upload images, and in the same page resize, crop and save them. Your newly resized or cropped images maintain their aspect ratio, which makes the script appealing even to those who are into sharing quotes images and such.

Download

jQuery File Upload

jQuery File Upload Demo jQuery UI version

jQuery File Upload is the perfect illustration of how file uploading works within jQuery and how it can be used for simply uploading and saving files. This library offers a slightly more versatile range of features though. To begin with, it comes with 5 different styles to choose from, including native jQuery UI, and also for AngularJS developers who need a quick and reliable file uploading solution for their projects. Features include the means to drag and drop multiple files from your desktop or other folder right into the uploader, you can cancel your uploads and also resume them, there’s a progress bar for each upload so you know when things are about to be finished, those with modern browsers will be able to edit images after they are uploaded, and the same browsers will enable to preview all uploaded files before finalizing. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads.

Download

jQuery.filer

jQuery.filer Simple HTML5 file uploader plugin tool for jQuery.

jQuery.filer is another complex jQuery file management plugin that comes PACKED with traditional and new features that will enable a profound file uploading experience. Features include things like file validators — specify the limits of the file size uploads, the number of files that can be uploaded, or even the type of files that can be uploaded. An editor that can be used to either preview files, or directly edit them from the browser — given that your browser supports the necessary API calls for such events. jQuery.filer also features its own API, meaning you can freely manipulate the appearance and functionality of your uploader. The documentation covers all aspects of possible calls and events that you can begin using right away.

Download

jQuery Ajax File Uploader

jQuery Ajax File Uploader

jQuery Ajax File Uploader is a great example of how simple (yet modern) file uploaders can be. Here we have an uploader that uses a simple file uploading approach with multiple files option, and a simple progress bar widget within the same page. Apart from being built for the modern browser, this plugin will require a little bit of JavaScript and AJAX knowledge/skills to set the appropriate parameters within the configuration so that you can create the right experience for you, but even then — most of the parameters are just traditional array settings, and don’t require much thinking for changing up. Built with Bootstrap.

Download

Dropzone

Dropzone.js

Dropzone is a modern drag and drop file uploader that works within a component widget on the website you are trying to use it, though it does support traditional click and upload concept as well. If you plan on using Dropzone for image uploading, the library supports live image editing after files are uploaded — editing, resizing, cropping, etc,. All file paths and file type configurations happen in the background, so you need to work with the Config files before launching the script on a production server. The official Dropzone homepage has all the documentation you need to get started right away.

Download

Fine Uploader

Fine Uploader Javascript Upload Library

Another full-scale jQuery file uploader solution is called Fine Uploader — a very popular jQuery library for uploading, managing, and scaling files. Some of the stand out features of Fine Uploader include the ability to retry failed file uploads, not from the beginning, but from the last chunk that wasn’t uploaded — this is also a part of the actual library, called file chunking and splitting. Fine Uploader fully supports cloud file management, meaning you can upload files on Amazon S3 or Microsoft’s Azure, and other simpler features include the permission to edit, delete files as they are being uploaded. This is pretty much a full-on solution for any site that needs a reliable file uploading solution where perhaps a larger community of active users is involved.

Download

Flow.js

Angular file upload flow.js

Let’s keep the flow of our file uploader scripts going, with another great resource called Flow.js! Flow.js is a JavaScript library providing multiple simultaneous, stable and resumable uploads via the HTML5 File API. Library does not require third party dependencies. It features capabilities like pausing and resuming file uploads, to recover last lost uploads, to handle errors within the uploader, a drag and drop file uploading solution, the ability to upload WHOLE folders, file preview for image files, progress bars to keep you in check about the progress of the file’s you are uploading. Chunk uploads to make sure that you can recover any lost pieces from uploads that have failed, and instead resume them from that point to save time, and headache.

Download

Formstone

Upload · Formstone

Formstone is unique to our file uploader list in a way that it’s actually a multitude of products (components) within a single project, but Formstone does have an Upload component that’s a very usable and very functional file upload management solution for websites and apps, both small and large. The lightweight component features a simple drag&drop interface (with click interaction) that lets you upload single or multiple files with a lightweight progress bar attached. It’s a very effective solution for websites that are looking for extra components without the heavy fat attached to them, but also Formstone is a project within itself, and you can stitch together the other few dozens of components and create a web or app project out of that. Learn more about Formstone to fully understand the interaction between the variety of components they have to offer.

Download

File Uploader

File Uploader Demo

File Uploader is an elegant and technical example of how modern web browsers can support quick and sound file upload needs of the modern web user. You can create various calls to help manage the files, but the main features that stand out — drag and drop file upload, progress bars, and ability to allocate each file upload to a specific user, where the user himself mentions his name. We can see how that could be modified into a fully functional solution for password protected file uploads and such.

Download

PekeUpload

PekeUpload by pekebyte

PekeUpload is a lightweight component solution that can be used as a website widget for uploading files using a jQuery + HTML5 combination of features. Built with Twitter Bootstrap, PekeUpload is incredibly easy to style and offers tons of ways to extend itself. With PekeUpload you remain in control of your file uploads, being able to set file size limits, and also the kind of file types that your component is going to accept. If traditional error notifications make you tired, rest assured that you can set your own custom error notifications. Visual content can be previewed directly before and after uploading.

Download

Backbone Upload Manager

Backbone Upload Manager

Backbone supplies structure to JavaScript-heavy applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface. It’s a very well-known JavaScript framework, and the Backbone Upload Manager is the perfect compliment for this framework and its users. The User Interface, and the actual experience, is very modern and stand out with a strong list of features and capabilities that only a solid framework like Backbone could provide.

Download

FileDrop

FileDrop.js demo self contained HTML5 AJAX drag drop file upload

FileDrop.js is a JavaScript optimized file uploading library that focuses on direct browser file uploading with custom notification alerts, without much other functionality. Select or drag your files, click upload and wait for you to be notified of a successful upload. There’s the ability to enable multiple file uploads if need be.

Download

FileAPI

FileAPI — a set of javascript tools for working with files.

Developers can of course build their own jQuery library for file management, it makes sense, as it provides a lot of learning experience, and you end up being the one in charge of the codebase. Then again, perhaps another way to solve the file uploading problem is to rely on an API that has been built specifically for one single purpose, which in this case is file uploading and file management. We recommend looking into FileAPI, a fully developed project that provides the necessary functions, calls and events to create file uploaders for desktop apps, mobile apps, and general web projects.

Download

Plupload

Plupload UI Widget

Plupload is one of those projects that took a really long to mature, but not because it was inexperienced, but because there was a huge limitation in the number of features languages like HTML were able to provide for the web at the time. Now that HTML5 is changing the web development landscape, Plupload is really able to shine. By definition, Plupload is a file upload management API that provides a number of tools and features for building strengthened file uploaders within a few minutes, rather than having you code your own over several weeks.

Download

Resumable.js

Resumable.js JavaScript magic for simultaneous stable and resumable uploads

Resumable.js’s main area of function is the HTML5 File Management API — providing a simple file upload environment that allows to upload multiple files, to pause and resume uploads, and an overall stability. Large files can easily be split into several chunks to enable resumable uploads, meaning that whenever a connection goes bonkers in the transition, you can rest assured that your file will still end up being uploaded from the same place it was left at.

Download

Uploadify

Demos Uploadify

How about a fully working HTML5 file uploader that uses a little bit of jQuery to polish the User Experience? Well, for those interested we can recommend Uploadify — a JavaScript library built with that exact purpose in mind, and there’s also a Flash version available for those who believe in old-school traditions. There’s an existing community forums full of topics and support questions, but from what we can tell the community forums hasn’t really been active for the past couple of years.

Download

Alex Ivanovs

Alex is a freelance writer with more than 10 years of experience in design, development, and small business. His work has been featured in publications like Entrepreneur, Huffington Post, TheNextWeb, and others.

This Post Has 5 Comments
  1. Alex – where did you see that dropzone could do image editing? I am using dropzone and would really like those kinds of features but I don’t see anything like that. I really hope it does. Let me know – appreciate it. Craig

    1. I’m seeking a tutorial for do the edit action too. But I don’t saw nothing anywhere. If someone knows something about it with dropzonejs, let me know please?

    1. Alexander,

      It appears that Igloolab has been discontinued and now their domain is used for some shady purposes. We have since removed that item from the list.
      Thanks for reporting it!

Leave a Reply

Your email address will not be published. Required fields are marked *