Using Dropzone.js inside Bootstrap modal

瘦欲@ 提交于 2020-01-03 08:41:33

问题


I'm using dropzone.js to upload files to the server. I included all the necessary js and css files and have put the file upload form inside a bootstrap modal.

The problem I'm facing is that, inside the modal the file select window does not get triggered once I click on the dropzone. Nor am I able to drag and drop the required files.

I'm using Laravel 4. Any direction on this issue would be great! Thanks in advance.

This is my code:

<script type="text/javascript" src="{{ URL::asset('js/dropzone/dropzone-      3.8.4/downloads/dropzone.js') }}"></script>
<link rel="stylesheet" type="text/css" href="{{ URL::asset('js/dropzone/dropzone-3.8.4/downloads/css/dropzone.css') }}">
<div id="fileToBeAdded">
    <div class="toBeAdded" data-type="file" style="">
        <button id="submit-all">Submit all files</button>
        <form action="{{ url('files/upload') }}" id="myDropzone" class="dropzone">
             <div class="fallback">
                 <input name="files[]" type="file" multiple />
             </div>
        </form>
    </div>
</div>

回答1:


I hope the there might be some problem with initialization of Dropzone

try to trigger Dropzone on click event of some other element.

like --

$(document).on('click','#someelement',function(){
 var myDropzone = new Dropzone("form#formIdWhichULikeToTriggerWithDropzone", { url: 'file_upload_route'});
});


来源:https://stackoverflow.com/questions/22139776/using-dropzone-js-inside-bootstrap-modal

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!