Dropzone stopped working after upgrade from "4.2.0" to "5.7.0" (using jquery "3.3.1")

Question

Im loading my libs like this:

<link href="~/lib/dropzone/dropzone.min.css" rel="stylesheet" />
<script src="~/lib/dropzone/dropzone.min.js"></script>
<script src="~/Scripts/jquery-3.3.1.min.js"></script>

And im using my dropzone like this:

var CountFiles = 0;
Dropzone.autoDiscover = false;
jQuery(document).ready(function () {

    Dropzone.autoDiscover = false;

    $("div#myPrincipalDropzone").dropzone({ ...etc.... even another dropzones...

This was working before, but im not sure why i get dropzone is not defined. Also if i put the libs explicitellty on the Index, i receive "'Symbol(Symbol.iterator)' is undefined"

tryed to add multiple Dropzone.autoDiscover = false; also change the syntax for the functions. Any idea?

Answer 1

This is the correct syntax:

<script type="text/javascript">

var CountFiles = 0;

$(document).ready(function () {

    Dropzone.autoDiscover = false;

    var Drop1 = new Dropzone("div#myPrincipalDropzone", { url: "/Article/UploadFiles",

        paramName: "file",
        maxFiles: 1,
        maxFilesize: 1200,
        maxFileHeight: 840,
        maxFileWidth: 840,
        acceptedFiles: ".png,.jpg",           
        addRemoveLinks: true,
        parallelUploads: 1,
        renameFile: function () {
            let newname = new Date().getTime() + '_' + 'Test';
            console.log("Nombre en RenameFile:" + newname);
            return newname;
        //},

        //init: function (newname) {

            this.on("addedfile", function (file) {