11

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

5 Answers5

12
myDropzone.destroy();

I swear I had the same problem and I'll find that with a lucky attempt... it works!

maxshuty
  • 9,708
  • 13
  • 64
  • 77
Paolo Ferraris
  • 121
  • 1
  • 3
2

I removed removedfile() function from Dropzone options and myDropzone.destroy(); worked for me.

colidyre
  • 4,170
  • 12
  • 37
  • 53
ANAS Farih
  • 31
  • 1
  • 4
  • Why did you have to remove the `removedfile()` function from the DropZone options? I have this function, and the `.destroy()` or `.disable()` function work out-of-the-box (tested with DropZone 5.x and 6.x). – AlexLaforge May 24 '22 at 06:18
1

According to the documentation:

If you do not need a dropzone anymore, just call .disable() on the object. This will remove all event listeners on the element, and clear all file arrays. To reenable a Dropzone use .enable()

If you initialize dropzone like:

var myDropzone = new Dropzone("#mydropzoneid", { url: "/some/url"});

You should be able to disable it with:

myDropzone.disable();
But those new buttons though..
  • 21,377
  • 10
  • 81
  • 108
wallek876
  • 3,219
  • 2
  • 19
  • 29
0

Use one of the following methods : The destroy() and disable() methods both exist, and they seem to act the exact same way.

In fact, DropZone does not have a real destruction method. These methods will "put the instance in pause" (what is, by design, the closest implementation of a DropZone instance destruction).

This applies to DropZone 5.x and DropZone 6.x (try myDropzone.disable() or myDropzone.destroy() in the console on this v6.x example page https://www.dropzone.dev/bootstrap.html) : The DropZone instance will be disabled, thus leading to the "Add Files..." button being inoperative.

The instance can then be re-enabled by calling myDropzone.enable().

PS : DropZone switch from v5 to v6 in 2021-2022. The website was completely revamped and screwed-up: the documentation is partial, incomplete, too short.

If you still need to access the excellent and exhaustive v5 documentation, you can head up to the obvious Web Archive Wayback machine ! Here is the very latest v5 documentation page https://web.archive.org/web/20210829160314/https://www.dropzonejs.com/

AlexLaforge
  • 499
  • 3
  • 19
0

If you want destroy all dropzone instances just add if (Dropzone.instances.length > 0) Dropzone.instances.forEach(dz => dz.destroy()) to document ready.

Marco Ramos
  • 1