페이지가 새로 고쳐지지 않으면 Dropzone이로드되지 않습니다.

Question

레일즈 애플리케이션에서 dropzone.js를 사용하고 있습니다. dropzone은 다른 입력 요소가있는 양식의 일부입니다. 페이지로드시 양식을 포함하는 div가 숨겨집니다. 버튼을 클릭하면 해당 div가 아래로 슬라이드됩니다. 그러나이 단계에서 Dropzone은 초기화되지 않습니다. 하지만 페이지를 새로 고침하고 동일한 버튼을 다시 클릭하면 정상적으로 작동합니다.

이 문제가 turbolinks했다

function dropzoneControl() { 
    Dropzone.options.myDropzone = { 
     url: '/the_url', 
     autoProcessQueue: false, 
     uploadMultiple: true, 
     parallelUploads: 5, 
     maxFiles: 5, 
     maxFilesize: 3, 
     acceptedFiles: 'image/*', 
     addRemoveLinks: true, 
     headers: { 
      'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content') 
     }, 
     init: function() { 
      dzClosure = this; 
      document.getElementById("submit-button").addEventListener("click", function(e) { 
       e.preventDefault(); 
       e.stopPropagation(); 
       dzClosure.processQueue(); 
      }); 

      //send all the form data along with the files: 
      this.on("sendingmultiple", function(data, xhr, formData) { 
       formData.append("name", $("#name").val()); * * other data * * 

      }); 

      //on successful upload 
      this.on("successmultiple", function(file, responseText) { 
       $('#name').val(""); * * clear the rest of the form * * 
      }); 

      this.on("queuecomplete", function(file) { 
       this.removeAllFiles(); 
      }); 
     } 
    } 
} 

Answer 1

(document.ready 내부) 내 DROPZONE 기능입니다. 다른 페이지에서 페이지에 왔을 때 dropzone이 작동하지 않습니다. 그러나 내가 그것을 바로 새롭게했을 때 일했다. 페이지에 대한 링크가 포함 된 div에 data-no-turbolink을 추가했습니다. 현재 잘 작동합니다.