Skip to content
blueimp edited this page May 18, 2011 · 44 revisions

Initialization

The basic initialization of the File Upload plugin is by calling the fileupload method on a jQuery collection with the target HTML element (usually a container element holding the file upload form, or the file upload form itself):

$('#fileupload').fileupload();

The method accepts an object as first argument that allows to initialize the widget with various Options:

$('#fileupload').fileupload({
    url: '/path/to/upload/handler.json',
    sequentialUploads: true
});

Setting options after initialization

It is also possible to set Options after plugin initialization:

$('#fileupload').fileupload(
    'option',
    'url',
    '/path/to/upload/handler.json'
);

Or setting multiple Options at once:

$('#fileupload').fileupload(
    'option',
    {
        url: '/path/to/upload/handler.json',
        sequentialUploads: true
    }
);

De-initialization

To remove the file upload widget from the element node, call the destroy method:

$('#fileupload').fileupload('destroy');

This will also remove any added event listeners.

Disable/Enable

As other widgets based on jQuery UI Widget, the File Upload widget can be disabled/enabled:

$('#fileupload').fileupload('disable');
$('#fileupload').fileupload('enable');

Programmatic file upload

Usually, file uploads are invoked by selecting files via the file upload button or dropping files on the drop zone.

However it is also possible to files programmatically.
Files can be added to the upload table:

$('#fileupload').fileupload('add', {files: filesList});

Or they can be send directly:

$('#fileupload').fileupload('send', {files: filesList});

The second argument must be an object with an array (or array-like list) of File or Blob objects as files property.
Other properties allow to override options for the file upload, e.g. the upload url:

$('#fileupload').fileupload('add', {files: filesList, url: '/path/to/upload/handler.json'});

Clone this wiki locally