DropzoneJS is an open source library that provides drag'n'drop file uploads with image previews. It is lightweight, does not depend on any other library (like jQuery)
Questions tagged [dropzone]
494 questions
34
votes
2 answers
Dropzone Submit Button on Upload
I want to add a button upload to my dropzone file uploader. currently it's uploading the file directly after selecting or dragging the file into the dropzone area. What I want to do is:
1. Select or drap file to be uploaded.
2. Validate
3. Hit or…
Gael Musi
- 678
- 1
- 7
- 20
25
votes
1 answer
Failed to construct 'FormData'
When I upload file in my dropzone, it do not work. Usually it's work very well, but since 1 month I have this JS Error :
Uncaught TypeError: Failed to construct 'FormData': parameter 1 is not of type 'HTMLFormElement'.
That is the code, when I use…
MasterSinge
- 665
- 3
- 9
- 22
12
votes
6 answers
How to manually trigger click for Dropzone (open select file dialog)
Dropzone only works on the element itself i have an SPAN tag inside my button, and when i click on the text it won't trigger click on parent element which dropzone is attached to. i tried the following but it doesn't…
Pezhvak
- 9,633
- 7
- 29
- 39
11
votes
2 answers
Best way to store file objects in React Redux store (files upload from DropZone?)
I am currently using Material Ui dropzone to upload multiple files. just wondering what is the best way to add/update files in the redux store. I am currently doing a dispatch action when "onChange" triggers which return all the files on the…
dev0864
- 465
- 2
- 7
- 17
11
votes
5 answers
How to destroy dropdzonejs?
How to destroy dropdzonejs?
When I have SPA and leave the page, I want to clean up so it does not listen to body events anymore.
Victoria A
- 111
- 1
- 6
10
votes
2 answers
Restrict Dropzone to upload only specific type of files
I am uploading files with Dropzone here is my code
9
votes
1 answer
DropZone: How to Accept .csv Files?
I've read quite a few answers on SO about this, and most advise using the acceptedFiles property to specify the accepted mime types.
However, the DropZone docs say:
Mime type determination is not reliable across platforms. CSV files,
for example,…
VikR
- 4,818
- 8
- 51
- 96
9
votes
1 answer
react dropzone cannot post with axios
I'm trying to use react-dropzone in my code and making a POST request to the server with axios, but the POST request always fails and I keep getting the following error:
Uncaught (in promise) Error: Request failed with status code 500
This is my…
gjs
- 131
- 1
- 9
9
votes
3 answers
react-dropzone opens files chooser twice
I an encountering an issue with react-dropzone for quite a long time.
First, let's jump straight to the problem with a video: https://drive.google.com/open?id=1UmWtHbQ9U0LBHxYtZ1YSoXrfsezwH-os
The file choser window opens twice on every file inputs…
Emmanuel Scarabin
- 705
- 2
- 9
- 24
8
votes
1 answer
How do you use Dropzone.js with chunked file uploads (PHP only)?
I can find plenty of documentation on how to use the chunked file upload with various API's and libraries, but I am unable to find how to use Dropzone.js chunked file upload with just plain PHP.
The documentation is very minimal. I cannot add any…
Lokiare
- 1,238
- 1
- 15
- 23
8
votes
1 answer
rename file option not working in dropzone.js
I've been trying to rename the filename before the upload in dropzone.js but I'm not able to make it work. This is my configuration:
Dropzone.autoDiscover = false;
Dropzone.options.myAwesomeDropzone = {
url: url,
paramName: "image",
…
Marco Herrarte
- 1,540
- 5
- 21
- 42
5
votes
0 answers
react-dropzone-uploader how to display already uploaded files from a react state
I am currently using RDU(react-dropzone-uploader) to upload files to the server, I am saving the uploaded files in a react state. I am trying to figure out how to display the already uploaded files as part of the preview on the dropzone from the…
dev0864
- 465
- 2
- 7
- 17
5
votes
1 answer
How to use Async Await in "onDrop" of "react-dropzone" ? (Parsing error: Can not use keyword 'await' outside an Async function)
I'm using "react-dropzone" for dropping files :
import React from "react";
import { useDropzone } from "react-dropzone";
const DropzoneUpload = ({ onDrop, accept }) => {
// Initializing useDropzone hooks with options
const { getRootProps,…
JAN
- 21,236
- 66
- 181
- 318
5
votes
3 answers
Dropzone max file only one and remove the second file
I just use my code like this
Dropzone.options.attachkyc = {
maxFiles: 1,
accept: function(file, done) {
console.log("uploaded");
done();
},
init: function() {
…
Wolfzmus
- 463
- 1
- 10
- 23
4
votes
3 answers
Is vue2-dropzone compatible with vue3?
vue2-dropzone is working fine for vue2 but not working for vue3.
With the following code
import vue2Dropzone from 'vue2-dropzone'
import 'vue2-dropzone/dist/vue2Dropzone.min.css'
return {
dropzoneOptions: {
autoProcessQueue: false,
…
Irfan Iqbal
- 41
- 1
- 3