File upload widget for ExtJS v4.1

This project is forked from ivan-novakov. Adding drag-and-drop-file feature allowing user to drag files into the grid body.

Features

• uses the native File API (HTML5)
• allows selecting multiple files at once
• uses raw PUT/POST request with the Ext.data.Connection object (no flash, or hidden iframes)
• displays upload progress
• supports asynchronous (simultaneous) upload

Requirements

• ExtJS 4.x
• browser supporting the File API
• server side :)

Usage

Clone the repository somewhere on your system and add the path with the prefix to Ext.Loader:

Ext.Loader.setPath({
    'Ext.ux.upload' : '/my/path/to/extjs-upload-widget/lib/upload'
});

Then you can use the dialog:

var dialog = Ext.create('Ext.ux.upload.Dialog', {
    dialogTitle: 'My Upload Widget',
    uploadUrl: 'upload.php'
});

dialog.show();

For the server side, see the upload.php file in the example.

Demo

• Demo included in this repository

Documentation

• API Docs

Other links

• More info in the blogpost
• Sencha forums post

TODO

• remove some hard-coded parts
• implement the main widget rather as a panel instead of a dialog for more flexibility
• add more uploader implementations
• add drag'n'drop support
• improve documentation

License

• FreeBSD License