File Extensions
Allow only specific file types by setting allowedExtensions. This demo accepts only .jpg, .png, and .gif files.
Drag & drop .jpg, .png, or .gif files here
<div id="myUploader" class="mu-uploader"> <button type="button" class="mu-select-btn">Select Images</button> <input type="file" class="mu-file-input" multiple accept=".jpg,.png,.gif" style="display:none" /> <div class="mu-dropzone"><div class="mu-dropzone-text">Drag & drop .jpg, .png, or .gif files here</div></div> ... </div>
var uploader = new MultipleUpload(document.getElementById('myUploader'), {
uploadUrl: '/api/upload',
allowedExtensions: ['jpg', 'png', 'gif']
});
The list the component enforces
allowedExtensions defaults to an empty string, meaning anything goes. Given a list — a comma-separated string or an array — files that do not match are rejected before any transfer begins, and the list also supplies the file dialog's filter when no accept is set.
Allow-list, never deny-list
Enumerating what you accept is finite and reviewable. Enumerating what you reject is a race you lose: there is always another extension, another double extension, another platform's executable format. If the answer is “images and PDFs”, say exactly that.