Plugins
Home

The plugins site is currently in development.

We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.

file upload


jQuery html5 file upload

Submitted by mihaild on February 1, 2010 - 5:17am

This plugin simplifies multiple file uploading using html5 "multiple" attribute in input file field.
Currently works in Firefox 3.6 and modern WebKit (Chrome, Safari, etc.) browsers.

fileUploadArea

Submitted by rudolfrck on November 28, 2009 - 5:28pm

Uses the new File API supported by Firefox 3.6. Enables you to target any html element and turn it into a hotspot for receiving files from the file explorer!

Each file will be sent as a binary AJAX-request with customizable GET params. Includes support for callbacks to track the progress and completion of each file and the total transaction.

Bulkuploader

Submitted by nivankafonseka on May 15, 2009 - 10:14am

This plugin enables you to do mutiple file uploading. The plugin is an extension function for the jQuery, easy to use.

File Upload by RonnieSan - Uploadify

Submitted by RonnieSan on February 22, 2009 - 4:47pm

Uploadify replaces any element with an ID with a browse button that can be used to upload single or multiple files. This plugin uses Flash 8 to accomplish this feat and is similar to SWFUpload, but much easier to implement. What's great about it is you can customize everything about the way it looks and acts very easily.

View the Demo Page

http://www.uploadify.com/demo

Written by Ronnie Garcia and Travis Nickels

Asynchronous File Upload

Submitted by mike.kaplinskiy on February 2, 2009 - 11:05pm

This gives a JQuery-like $.ajax function to upload file(s).

Usage:

$('.myUploadFileInputs, .anythingElseYouWantInTheFormTag').ajaxFileUpload({
  url: 'upload.php',
  data: {'UPLOAD_IDENTIFIER': uniqId},
  dataType: 'xml',
  timeout: 600,
  success: function(data, status) {  alert("GOT IT: " + data); },
  error: function(data, status, e) { alert("Something went horribly wrong"); }
});

The parameters are similar to the normal $.ajax function.

I STRONGLY SUGGEST that you use a timeout. No events are not fired for network errors, so there is no way to detect if the upload stopped.

A good chunk of the options from $.ajaxSetup is respected.

Styling File Inputs

Submitted by n0nick on January 18, 2009 - 7:02am

This is a jQuery implementation of the SI_Files JS library created by Shaun Inman and described here: http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom.

It uses the same method of creating an upload button using a div with a background image, and then moving a transparent file field with the user's cursor as she hovers the div.
As opposed to other file field styling methods, this one worked as I intended even in complicated layouts, i.e. the controller is positioned inside a floating or relatively-positioned element.