dropzonejs-railsとオプションの使用

Question

私は、ファイルを自分のレールアプリにアップロードするためにdropzone.jsを使用しています。しかし、カスタムオプションを使用する際に問題が発生しています。私はDropzone.jsの例のコードを使用しています。

これは私のコードです：

<%= form_for(@document, html: {multipart: true, class: 'dropzone', id: 'myAwesomeDropzone'}) do |f| %> 
    <div class="fallback"> 
     <%= f.file_field :document %><br> 
     <%= f.submit 'Upload my document' %> 
    </div> 
<% end %> 

JSコード：私は、ブラウザでそれをしようとすると

document.addEventListener("turbolinks:load", function() { 
    // disable auto discover 
    Dropzone.autoDiscover = false; 

    // "myAwesomeDropzone" is the camelized version of the HTML element's ID 
    Dropzone.options.myAwesomeDropzone = { 
     paramName: "file", // The name that will be used to transfer the file 
     maxFilesize: 2, // MB 
     dictDefaultMessage : 'Testing' 
    }; 

}); 

、ドロップゾーンは動作しますが、オプションでJavaScriptコードを無視します。私は間違っているの？

Answer 1

問題は、自動検出が行われた後にフォームを構成している（自動検出を停止している）と思います。あなたの正確な同じform_forタグを使用して、私はそれがturbolinks:loadイベントの

Dropzone.autoDiscover = false; 

外を移動し、構成ブロックの後に新しいドロップゾーンを初期化することによって動作させることができました。私のジャバスクリプトは次のように見てしまった：

Dropzone.autoDiscover = false; 
document.addEventListener("turbolinks:load", function() { 
    // "myAwesomeDropzone" is the camelized version of the HTML element's ID 
    Dropzone.options.myAwesomeDropzone = { 
     paramName: "file", // The name that will be used to transfer the file 
     maxFilesize: 2, // MB 
     dictDefaultMessage : 'Testing' 
    }; 

    new Dropzone("#myAwesomeDropzone"); 
}); 

、これはちょうど

Dropzone.autoDiscover = false; 
document.addEventListener("turbolinks:load", function() { 
    new Dropzone("#myAwesomeDropzone", { 
    paramName: "file", 
    maxFilesize: 2, 
    dictDefaultMessage: 'Testing' 
    }); 
});