new Uploader(container, options)uploader.jsline 84
FileUploader component controller
PARAMETERS
Name Type Description container
jQuery
Container element to generate component
options
object
Options
PROPERTIES
Name Type Description url
object
Server request urls
PROPERTIES
Name Type Description send
string
To send files to server
remove
[ string ]
To remove files on server (Using when transfer type is normal)
redirectURL
[ string ]
This option is only used in IE7 for CORS
isMultiple
[ boolean ]
Whether selecting multiple file or not
isBatchTransfer
[ boolean ]
Whether using batch transfer or not
useFolder
[ boolean ]
Whether the folder can be selected or not. If it is ture, 'isMultiple' option will be ignored
listUI
object
To set a list view
PROPERTIES
Name Type Description type
object
List type ('simple' or 'table')
item
[ string ]
List item's template when using list type is 'simple'
columnList
[ Array ]
List item's template when using list type is 'table'
usageStatistics
boolean = true
Send the hostname to google analytics.
If you do not want to send the hostname, this option set to false.EXAMPLES
// Case 1: Using normal transfer & simple list // // <!-- HTML --> // <div id="uploader"> // <input type="file" name="userfile[]"> // <div class="tui-js-file-uploader-list"></div> // </div> // var FileUploader = tui.FileUploader; // require('tui-file-uploader'); var instance = new FileUploader($('#uploader'), { url: { send: 'http://localhost:3000/upload', remove: 'http://localhost:3000/remove' }, isBatchTransfer: false, listUI: { type: 'simple' } }); // Case 2: Using batch transfer & table list & make dropzone // // <!-- HTML --> // <div id="uploader"> // <input type="file" name="userfile[]"> // <div class="tui-js-file-uploader-list tui-js-file-uploader-dropzone"></div> // <button type="submit">Upload</button> // </div> // var FileUploader = tui.FileUploader; // require('tui-file-uploader'); var instance = new FileUploader($('#uploader'), { url: { send: 'http://localhost:3000/upload' }, isBatchTransfer: true, listUI: { type: 'table' } });
Instance Methods
getCheckedList()uploader.jsline 434
Get checked list items
RETURNS:
{object
} - Checked items
getTotalSize(items)uploader.jsline 457
Get file's total size
PARAMETERS
Name Type Description items
object
File data list to get total size
RETURNS:
{string
} - Total size with unit
removeList(items)uploader.jsline 442
Remove file list
PARAMETERS
Name Type Description items
object
Removed file's data
Events
checkuploader.jsline 279
Check event
PROPERTIES
Name Type Description id
string
File id
name
string
File name
size
string
File size
state
boolean
Checked state
EXAMPLES
FileUploader.on('check', function(evt) { console.log(evt.id + ' checked state is ' + evt.state); });
checkAlluploader.jsline 292
Check event
PROPERTIES
Name Type Description filelist
string
Checked file list
EXAMPLES
FileUploader.on('checkAll', function(evt) { console.log(evt.filelist); });
erroruploader.jsline 469
Error event
PROPERTIES
Name Type Description status
string
Error status
message
string
Error message
EXAMPLES
fileUploader.on('error', function(evt) { console.log(evt.status); });
removeuploader.jsline 469
Remove event
EXAMPLES
fileUploader.on('remove', function(evt) { console.log('state: ' + evt['fileId']); });
successuploader.jsline 469
Success event
PROPERTIES
Name Type Description filelist
Array
Uploaded file list
success
[ number ]
Uploaded file count
failed
[ number ]
Failed file count
count
[ number ]
Total count
EXAMPLES
fileUploader.on('success', function(evt) { console.log(evt.filelist); });
updateuploader.jsline 469
Update event when using batch transfer
PROPERTIES
Name Type Description filelist
Array
Updated file list
EXAMPLES
fileUploader.on('update', function(evt) { console.log(evt.filelist); });