Skip to main content

Configuration Options

Here is a list of all available options for Dropzone. In case any of this information is outdated (please inform us, if that's the case) or you need more insight, you can always look at the options.js that is used in the actual library.

NameDefaultDescription
urlnullHas to be specified on elements other than form (or when the form doesn't have an action attribute). You can also provide a function that will be called with files and must return the url (since v3.12.0)
method"post"Can be changed to "put" if necessary. You can also provide a function that will be called with files and must return the method (since v3.12.0).
withCredentialsfalseWill be set on the XHRequest.
timeoutnullThe timeout for the XHR requests in milliseconds (since v4.4.0). If set to null or 0, no timeout is going to be set.
parallelUploads2How many file uploads to process in parallel (See the Enqueuing file uploads documentation section for more info)
uploadMultiplefalseWhether to send multiple files in one request. If this it set to true, then the fallback file input element will have the multiple attribute as well. This option will also trigger additional events (like processingmultiple). See the events documentation section for more information.
chunkingfalse

Whether you want files to be uploaded in chunks to your server. This can't be used in combination with uploadMultiple.
See chunksUploaded for the callback to finalise an upload.

forceChunkingfalseIf chunking is enabled, this defines whether every file should be chunked, even if the file size is below chunkSize. This means, that the additional chunk form data will be submitted and the chunksUploaded callback will be invoked.
chunkSize2000000If chunking is true, then this defines the chunk size in bytes.
parallelChunkUploadsfalseIf true, the individual chunks of a file are being uploaded simultaneously.
retryChunksfalseWhether a chunk should be retried if it fails.
retryChunksLimit3If retryChunks is true, how many times should it be retried.
maxFilesize256The maximum filesize (in bytes) that is allowed to be uploaded.
paramName"file"The name of the file param that gets transferred. NOTE: If you have the option uploadMultiple set to true, then Dropzone will append [] to the name.
createImageThumbnailstrueWhether thumbnails for images should be generated
maxThumbnailFilesize10In MB. When the filename exceeds this limit, the thumbnail will not be generated.
thumbnailWidth120If null, the ratio of the image will be used to calculate it.
thumbnailHeight120The same as thumbnailWidth. If both are null, images will not be resized.
thumbnailMethod"crop"How the images should be scaled down in case both, thumbnailWidth and thumbnailHeight are provided. Can be either contain or crop.
resizeWidthnull

If set, images will be resized to these dimensions before being uploaded. If only one, resizeWidth or resizeHeight is provided, the original aspect ratio of the file will be preserved.
The options.transformFile function uses these options, so if the transformFile function is overridden, these options don't do anything.

resizeHeightnullSee resizeWidth.
resizeMimeTypenullThe mime type of the resized image (before it gets uploaded to the server). If null the original mime type will be used. To force jpeg, for example, use image/jpeg. See resizeWidth for more information.
resizeQuality0.8The quality of the resized images. See resizeWidth.
resizeMethod"contain"How the images should be scaled down in case both, resizeWidth and resizeHeight are provided. Can be either contain or crop.
resizeTransparencyFillnullThe color shown through transparent parts of a resized image, as any CSS color. Formats without an alpha channel can't store transparency, so a transparent PNG resized to image/jpeg comes out with black where it used to be see-through; setting this to "#fff" makes it white instead. This does not affect the preview thumbnails, which are always PNG and keep their transparency. See resizeWidth.
filesizeBase1000The base that is used to calculate the displayed filesize. You can change this to 1024 if you would rather display kibibytes, mebibytes, etc... 1024 is technically incorrect, because 1024 bytes are 1 kibibyte not 1 kilobyte. You can change this to 1024 if you don't care about validity.
maxFilesnullIf not null defines how many files this Dropzone handles. If it exceeds, the event maxfilesexceeded will be called. The dropzone element gets the class dz-max-files-reached accordingly so you can provide visual feedback.
headersnullAn optional object to send additional headers to the server. Eg: { "My-Awesome-Header": "header value" }
defaultHeaderstrueWhether the default headers are sent: Accept: application/json, Cache-Control: no-cache and X-Requested-With: XMLHttpRequest. Set to false to send none of them.
clickabletrue

If true, the dropzone element itself will be clickable, if false nothing will be clickable.
You can also pass an HTML element, a CSS selector (for multiple elements) or an array of those. In that case, all of those elements will trigger an upload when clicked.

ignoreHiddenFilestrueWhether hidden files in directories should be ignored.
acceptedFilesnull

The default implementation of accept checks the file's mime type or extension against this list. This is a comma separated list of mime types or file extensions.
Eg.: image/*,application/pdf,.psd
If the Dropzone is clickable this option will also be used as accept parameter on the hidden file input as well.

acceptedMimeTypesnullDeprecated! Use acceptedFiles instead.
autoProcessQueuetrue

If false, files will be added to the queue but the queue will not be processed automatically. This can be useful if you need some additional user input before sending files (or if you want want all files sent at once). If you're ready to send the file simply call myDropzone.processQueue().
See the Upload Queue documentation section for more information.

autoQueuetrueIf false, files added to the dropzone will not be queued by default. You'll have to call enqueueFile(file) manually.
addRemoveLinksfalseIf true, this will add a link to every file preview to remove or cancel (if already uploading) the file. The dictCancelUpload, dictCancelUploadConfirmation and dictRemoveFile options are used for the wording.
previewsContainernullDefines where to display the file previews – if null the Dropzone element itself is used. Can be a plain HTMLElement or a CSS selector. The element should have the dropzone-previews class so the previews are displayed properly.
disablePreviewsfalseSet this to true if you don't want previews to be shown.
hiddenInputContainer"body"

This is the element the hidden input field (which is used when clicking on the dropzone to trigger file selection) will be appended to. This might be important in case you use frameworks to switch the content of your page.
Can be a selector string, or an element directly.

capturenullIf null, no capture type will be specified If camera, mobile devices will skip the file selection and choose camera If microphone, mobile devices will skip the file selection and choose the microphone If camcorder, mobile devices will skip the file selection and choose the camera in video mode On apple devices multiple must be set to false. AcceptedFiles may need to be set to an appropriate mime type (e.g. "image/*", "audio/*", or "video/*").
renameFilenamenullDeprecated. Use renameFile instead.
renameFilenullA function that is invoked before the file is uploaded to the server and renames the file. This function gets the File as argument and can use the file.name. The actual name of the file that gets used during the upload can be accessed through file.upload.filename.
forceFallbackfalseIf true the fallback will be forced. This is very useful to test your server implementations first and make sure that everything works as expected without dropzone if you experience problems, and to test how your fallbacks will look.
dictDefaultMessage"Drop files here to upload"The text used before any files are dropped.
dictFallbackMessage"Your browser does not support drag'n'drop file uploads."The text that replaces the default message if the browser is not supported.
dictFallbackText"Please use the fallback form below to upload your files like in the olden days."The text added before the fallback form. Ignored if you provide a fallback element yourself, or if this is null.
dictFileTooBig"File is too big ({{filesize}}MiB). Max filesize: {{maxFilesize}}MiB."Shown if the file is too big. {{filesize}} and {{maxFilesize}} are replaced with the respective configuration values.
dictInvalidFileType"You can't upload files of this type."Shown if the file does not match acceptedFiles.
dictThumbnailError"Failed to load the image. The file may be corrupted."Shown if a file looks like an image but cannot be decoded, so no thumbnail can be generated for it (since 6.1.0).
dictResponseError"Server responded with {{statusCode}} code."Shown if the server response was invalid. {{statusCode}} is replaced with the server's status code.
dictCancelUpload"Cancel upload"If addRemoveLinks is true, the text used for the cancel upload link.
dictUploadCanceled"Upload canceled."Shown if an upload was manually canceled.
dictCancelUploadConfirmation"Are you sure you want to cancel this upload?"If addRemoveLinks is true, the confirmation shown before an upload is cancelled.
dictRemoveFile"Remove file"If addRemoveLinks is true, the text used for the remove file link.
dictRemoveFileConfirmationnullIf this is not null, the user is prompted with it before a file is removed.
dictMaxFilesExceeded"You cannot upload any more files."Shown if maxFiles is set and exceeded. {{maxFiles}} is replaced with the configuration value.
dictFileSizeUnits{ tb: "TB", gb: "GB", mb: "MB", kb: "KB", b: "b" }Lets you translate the file size units, starting with tb for terabytes and going down to b for bytes.
binaryBodyfalseSends the file as a binary blob in the body instead of as form data. The params option is ignored when this is set, and setting it together with uploadMultiple is an error, since multiple files cannot share a single binary body.