2016-09-28 12 views
0

私のブートストラップモーダルでは、その中にdivパネルがあり、何も表示されないモーダルをクリックしようとするたびにdropzoneのフォームです。これは、モーダルの外側であれば正しく動作しています。私はまた、Dropzone.autoDiscover = false;もうまくいきません。jQuery:Dropzone.jsがブートストラップモーダル内で動作しない

<div class="panel-body" id="id_dropzone"> 
    <form action="UploadImages" 
          class="dropzone" 
          id="my-awesome-dropzone" enctype="multipart/form-data"> 
        </form> 
</div> 

JS

$(document).on('click','#add_newContestant', function(e){ 
    e.preventDefault(); 
    Dropzone.autoDiscover = false; 
    var myDropzone = new Dropzone("div#id_dropzone", { url: 'UploadImages'}); 
}); 
+0

ブートストラップモーダル 'shown'イベントでdropzoneをトリガーする必要があります。モーダルのドキュメントをチェックすると、 'shown.bs.modal'のような異なるイベントが表示されます。 –

答えて

0

ここで私は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 
    accept: function(file, done) { 
    if (file.name == "anything.jpg") { 
     done("false"); 
    } 
    else { done(); } 
    } 
}; 

Dropzone.options.myAwesomeDropzone = { 
     paramName: "file", 
     maxFilesize: 10, 
     url: 'UploadImages', 
     previewsContainer: "#dropzone-previews", 
     uploadMultiple: true, 
     parallelUploads: 5, 
     maxFiles: 20, 
     init: function() { 
      var cd; 
      this.on("success", function (file, response) { 
       $('.dz-progress').hide(); 
       $('.dz-size').hide(); 
       $('.dz-error-mark').hide(); 
       console.log(response); 
       console.log(file); 
       cd = response; 
      }); 

       ....... 

を使用していなかった、この方法を試してみてください。このフィドルDropzone in Modalを確認してください。私はこれがあなたを助けると思う。

関連する問題