jquery - Dropzone not works when push a new element with jQjuery -


i have form create article. used dropzone manage upload files. user might need add new dropzone more one. so, working accept when tried push more dropzone through jquery. think dropzone not start again.

$('.btn-add').click(function (e) {     e.preventdefault();     var element = '';     element = '<div class="article-item ui-state-default">'     + '<div class="dropzone dropzone-previews multiple-upload>'     + '</div>';     ('#sortable').append(element); });    dropzone.autodiscover = false;    $('div.multiple-upload').dropzone({         acceptedfiles : '.png, .gif, .jpg',         dictcancelupload : '',         dictcanceluploadconfirmation : '',         maxfilesize : 100,         addremovelinks : true,         init: function () {              thisdropzone = this;              var extractele = thisdropzone.element.classname;              var extractclass = extractele.split(' ');              var obj = $('.' + extractclass[3]);              var filename = $(obj).find('.media-item').val();              var file_array = [];              if (filename !== '') {                  file_array = filename.split(',');              }               (var index = 0; index < file_array.length; index++) {                   var mockfile = {name: file_array[index], size: 75};                   thisdropzone.options.addedfile.call(thisdropzone, mockfile);                   thisdropzone.options.thumbnail.call(thisdropzone, mockfile, base_url + '/articles/' + file_array[index]);              }            },            url: base_url + '/writer/articles/upload'  }); 

if want create dropzone every time click button, should add .dropzone() method inside click event, div element created, have errors in var element string.

here example:

$('.btn-add').click(function (e) {     e.preventdefault();     var element = '';     element = '<div class="article-item ui-state-default">'     + '<div class="dropzone dropzone-previews multiple-upload">'     + '</div></div>';     $('#sortable').append(element);       $('div.multiple-upload').last().dropzone({         acceptedfiles : '.png, .gif, .jpg',         dictcancelupload : '',         dictcanceluploadconfirmation : '',         maxfilesize : 100,         addremovelinks : true,         init: function () {             thisdropzone = this;             var extractele = thisdropzone.element.classname;             var extractclass = extractele.split(' ');             var obj = $('.' + extractclass[3]);             var filename = $(obj).find('.media-item').val();             var file_array = [];             if (filename !== '') {                 file_array = filename.split(',');             }              (var index = 0; index < file_array.length; index++) {                 var mockfile = {name: file_array[index], size: 75};                 thisdropzone.options.addedfile.call(thisdropzone, mockfile);                 thisdropzone.options.thumbnail.call(thisdropzone, mockfile, base_url + '/articles/' + file_array[index]);             }         },         url: base_url + '/writer/articles/upload'     }); }); 

just note in particular case there no need add dropzone.autodiscover = false since there isn't dropzone element when page loads.


Comments

Popular posts from this blog

sql server - Cannot query correctly (MSSQL - PHP - JSON) -

php - trouble displaying mysqli database results in correct order -

C++ Linked List -