javascript - Reinitialize/Reset dropzone after form is submitted -


i'm using dropzone.js upload image on ruby on rails .here html code

<div class="row">   <div class="col-md-12" id="drop-zone-container">     <%= form_tag '/settlement_proofs', method: :post, class: 'dropzone form', id: 'media-dropzone' %>         <div class="fallback">           <%= file_field_tag 'attachment', multiple: true%>         </div>     <% end %>   </div> </div> 

and initialized dropzone

$("#media-dropzone").dropzone({     acceptedfiles: pg.constants.accepted_format,     maxfilesize: pg.constants.attachment_max_file_size, //in mb     maxfiles: pg.constants.attachment_max_size,     addremovelinks: true,     removedfile: function (file) {         if (file.xhr.responsetext.length > 0) {             var fileid = json.parse(file.xhr.responsetext).id;             $.ajax({                 url: pg.constants.url.settlement_base_url + fileid,                 method: 'delete',                 datatype: "json",                 success: function (result) {                     $('#uploaded_attachment').val($("#uploaded_attachment").val().replace(result.id + ',', ""));                     $('#settlement_proof_status span').fadeout(0);                     var _ref;                     return (_ref = file.previewelement) != null ? _ref.parentnode.removechild(file.previewelement) : void 0;                  },                 error: function () {                     $('#settlement_proof_status').text(i18n.t('attachment_deletion_error')).fadein();                 }              });         }      },     init: function () {          this.on("success", function (file, message) {             debugger;             appendcontent(message.attachment.url, message.id);         });          this.on("error", function (file, message) {             $('#settlement_proof_status span').text(message).fadein();             var _ref;             return (_ref = file.previewelement) != null ? _ref.parentnode.removechild(file.previewelement) : void 0;         });         $('#settlement_invoice_submit_btn').click(function () {             $("#new_settlement_invoice").submit();         });         $('#uploaded_attachment').change(function () {             if (this.value.length == 0) {                 this.removeallfiles();             }         });     } }); 

after submit form through ajax, need dropzone field reset default image.

this.on("complete", function(file) {     this.removeallfiles(true);  }) 

write above code in init function.

this removes files in dropzone , resets dropzone initial state.

http://www.dropzonejs.com/#event-reset


Comments