1

Based on Dropozone.js FAQ I have tried to display a message on successful upload.

Code from the header looks like:

<script>
$(document).ready(function() {
    Dropzone.options.myDropzone = {
      init: function() {
        this.on("success", function(file, responseText) {
          var responseText = "TaDa!";
          file.previewTemplate.appendChild(document.createTextNode(responseText));
        });
      }
    };
)};
</script>

And code from the html section:

<form action="/file-upload" class="dropzone" id="my-dropzone"></form>

Drag and drop upload works fine but I'm not getting desired message on success.

2 Answers 2

8

This is because dropzone initializes before the options are set, to avoid this just place the dropzone options outside the ready function.

<script>

    Dropzone.options.myDropzone = {
        init: function() {
            this.on("success", function(file, responseText) {
            var responseText = "TaDa!";
            file.previewTemplate.appendChild(document.createTextNode(responseText));
            });
        }
    };

    $(document).ready(function() {
        // Your other javascript
    )};

</script>
1

I had this problem too and after trying the solution @wallek876 provided I was still unable to set options for the #Media_Dropzone object. finally I've found that Dropzone is unable to find elements with ID's in which contain underscores!! so basically renaming the element from #Media_Dropzone to #MediaDropzone and of-course implementing the accepted answer here solved my problem.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.