Stack Overflow
Stack Overflow

Questions tagged [dropzone.js]

An open-source javascript library which provides drag-and-drop file uploads with image previews

Dropzone.js is a light weight library that turns an element into a dropzone. This means that a user can drag and drop a file onto it, and the file is uploaded to the server by . It supports all major browsers (IE, FireFox, Chrome, Safari, Opera) natively and has legacy file input support for others.

Starting with version 2.0 this library no longer depends on , but it still registers itself as a module if available.

This tag should be used for questions about the usage of the Dropzonejs API in web development.

Relevant Links:

2258 questions
214
votes
13 answers

Integrating Dropzone.js into existing HTML form with other fields

I currently have a HTML form which users fill in details of an advert they wish to post. I now want to be able to add a dropzone for uploading images of the item for sale. I have found Dropzone.js which seems to do most of what I need. However, when…
Ben Thompson
  • 4,743
  • 7
  • 35
  • 52
96
votes
11 answers

How do I change the default text in dropzone.js?

I am using dropzone.js to upload files. However, I'm having difficulty changing the default text. I've tried instantiating the dropzone class: $(document).ready(function(){ $(".foo").dropzone({ dictDefaultMessage: "hello" }); }); With this…
Sheldon
  • 9,639
  • 20
  • 59
  • 96
84
votes
13 answers

How to limit the number of dropzone.js files uploaded?

Depending on the use case, how do I constrain the number of files that dropzone.js will allow? For example, I might need to only allow 1, 2, or 4 files uploaded. It's not uploadMultiple. Unfortunately, uploadMultiple only applies to the number of…
pydanny
  • 7,954
  • 6
  • 34
  • 42
66
votes
9 answers

How can I show you the files already stored on server using Dropzone.js

I Don't understand that... call its always undefined Create the mock file: var mockFile = { name: "Filename", size: 12345 }; Call the default addedfile event handler myDropzone.options.addedfile.call(myDropzone, mockFile); And optionally show the…
Marcogomesr
  • 2,614
  • 3
  • 30
  • 41
60
votes
12 answers

How can I fix this "Dropzone already attached" error?

I have this sample: link I managed to create this form but unfortunately it does not work because I get error. Dropzone already attached. CODE HTML:
Marius
  • 1,181
  • 3
  • 15
  • 23
60
votes
9 answers

dropzone.js - how to do something after ALL files are uploaded

I am using dropzone.js for my drag-drop file upload solution. I am stuck at something where I need to call a function after all the files are uploaded. In this case, Dropzone.options.filedrop = { maxFilesize: 4096, init: function () { …
Subliminal Hash
  • 13,614
  • 20
  • 73
  • 104
55
votes
2 answers

how to upload and delete files from dropzone.js

I have used the below code the image has been deleted but the thumbnail image still showing. Dropzone.options.myDropzone = { init: function() { this.on("success", function(file, response) { file.serverId = response; }); …
Aaru
  • 803
  • 4
  • 13
  • 29
54
votes
10 answers

Dropzone.js uploads only two files when autoProcessQueue set to false

I use Dropzone.js and I want it to upload the dropped not automatically but when the user clicks a button. So I set the autoProcessQueue option to false. When the button is clicked the processQueue() method is called. I would suppose that now the…
Juuro
  • 1,487
  • 5
  • 16
  • 27
47
votes
7 answers

dropzone upload only one file

I am using dropzone.js for my drag-drop file upload solution. I want to upload only one file,if i upload second file the first one should be remove and second one should be uploaded. any idea how to do it.. here is my html
user3064914
  • 921
  • 1
  • 7
  • 18
45
votes
2 answers

Dropzone - Uncaught Error: No URL provided

I can't figure out how to get JSONresponse after uploading a file using Dropzonejs. I have just this:
Milano
  • 18,048
  • 37
  • 153
  • 353
42
votes
4 answers

Send custom data with dropzone.js on each File Upload

I am using dropzone in my Code Igniter Project. With every drag of a file, dropzone creates an ajax request and my files is getting stored on the server too. But now, my requirement is that I want to send additional data (DYNAMIC) alongside the…
Abhinav
  • 8,028
  • 12
  • 48
  • 89
42
votes
6 answers

DropzoneJS: How to get PHP response after upload success?

I'm trying to implement Dropzone on my site. I want to listen for the "success" event and then take the server response and add some info from it to a form on the same page as the DropZone after the upload is completed. the info i want to get in the…
Patrick Falize
  • 599
  • 1
  • 6
  • 11
41
votes
13 answers

How to include the CSRF token in the headers in Dropzone upload request?

I am working on a single page application and I am using Laravel 5 for the web service. All forms are submitted asynchronously and I use a beforeSend on them to attach the CSRF token which I take from the meta tag like so: $.ajax({ url:…
Rohan
  • 13,308
  • 21
  • 81
  • 154
40
votes
8 answers

Sending additional parameter with dropzone.js

I am trying to add dropzone.js and I'd like to pass another parameter with file, so I put hidden input in form . I can upload file and can read it in Java part but I can't read type_chooser, ------WebKitFormBoundaryZxF6MCYJpTOLUokN …
Sahin Yanlık
  • 1,171
  • 2
  • 11
  • 21
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
1
2 3
…
99 100