Multiple Uploaders on One Page

(function() {
 new MultipleUpload('#demo-images', {
 uploadUrl: '/api/upload/images',
 multiple: true,
 accept: 'image/*',
 showThumbnails: true,
 buttonText: 'Select Images'
 });
 new MultipleUpload('#demo-docs', {
 uploadUrl: '/api/upload/documents',
 multiple: true,
 allowedExtensions: '.pdf,.docx,.xlsx,.txt',
 showThumbnails: false,
 buttonText: 'Select Documents'
 });
})();

Independent instances on one page

Each uploader is constructed against its own container and keeps its own queue, options and callbacks. Nothing is shared, so an avatar picker restricted to one image and a documents area accepting twenty PDFs coexist on the same form without interfering.

Keeping them apart

Give each container a distinct id: getInstance is keyed on it, and a hidden field per uploader is what keeps the form submission unambiguous about which files belong where. It is the one piece of bookkeeping that separate instances actually require.