Send custom data with dropzone.js on each File Upload

Abhinav picture Abhinav · Mar 16, 2015 · Viewed 54.6k times · Source

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 file. With the use of params, Only static datas can be sent, but the data I want to send will be changing everytime.

This is how my code looks:

<script>
 Dropzone.autoDiscover = false;
  Dropzone.options.attachment = {
        init: function(){
          this.on('removedfile',function(file){
            // console.log('akjsdhaksj');
            var fileName = file.name;
            $.ajax({
              type: 'POST',
              url: "<?php echo BASE_URL.'index.php/admin/mail_actions/deleteFile' ?>",
              data: "id="+fileName,
              dataType: 'html'
            });
          });
        },
        // params: {
        // customerFolder: $('#toValue').substr(0, toValue.indexOf('@')),
        // },
        dictDefaultMessage:"Click / Drop here to upload files",
        addRemoveLinks: true,
        dictRemoveFile:"Remove",
        maxFiles:3,
        maxFilesize:8,
  }

$(function(){

  var uploadFilePath = "<?php echo BASE_URL.'index.php/admin/mail_actions/uploadFile' ?>";
  var myDropzone     = new Dropzone("div#attachment", { url: uploadFilePath});

});
</script>

Anyway I can achieve it?

Answer

Abhinav picture Abhinav · Mar 16, 2015

I got it. This is what I had to use

myDropzone.on('sending', function(file, xhr, formData){
    formData.append('userName', 'bob');
});