Works with any backend npm install Zero dependencies

Overall Progress Callback

Track aggregate upload progress across all files with onProgress.

Overall0%
Uploaded0 B
Total0 B
Files0/0
(function() {
 new MultipleUpload('#demo', {
 uploadUrl: '/api/upload',
 multiple: true,
 onProgress: function(p) {
 document.getElementById('s1').textContent = p.percent + '%';
 document.getElementById('s2').textContent = MultipleUpload.formatSize(p.uploadedBytes);
 document.getElementById('s3').textContent = MultipleUpload.formatSize(p.totalBytes);
 document.getElementById('s4').textContent = p.completedFiles + '/' + p.totalFiles;
 }
 });
})();

The queue-level callback

onProgress receives overall queue progress, weighted by bytes, and the uploader. It is the hook for driving your own indicator — a bar in a header, a percentage in the page title, a disabled submit button that re-enables at 100%.

Per-file is a different callback

onTaskProgress is the per-file one and receives the task, with the percentage on task.progress. Mixing them up produces the classic bug where the overall bar jumps backwards each time a new file starts, because it is being fed one file's number.