Dropzone.js 이벤트가 실행되지 않습니다.

일부 이벤트 핸들러가있는 Dom에 dropzone 양식이 있습니다. 그러나 어떤 사건도 실행에 옮겨지지 않았습니다. 파일은 서버로 전송됩니다. 일부 후Dropzone.js 이벤트가 실행되지 않습니다.

$(function() { 

    Dropzone.autoDiscover = true; 
    Dropzone.options.dropzoneForm = { 
    init: function() { 
     this.on("success", function(response) { 
     alert('Success event fired! Check console'); 
     console.log(response); 
     }); 
    }, 

    paramName: "file" 

    }; 

});

출처

2017-04-16 s.n

양식에 요소가 없으므로 이벤트를 감지 할 수있는 크기가 없다고 생각됩니다. 파일 입력을 추가 해보고, 드롭 영역을위한 크기의 스타일을 가진 부모 div에 dropzone을 사용하십시오. –

여전히 작동하지 않는 양식 내에서 다음 요소를 추가하려고 시도했습니다. –

http://www.dropzonejs.com/ 문서를 참조하십시오. –

<div> 
    <form action="/file/upload" class="dropzone" id="dropzoneForm" method="post"></form> 
</div>

스크립트 : 난 그냥 데이터베이스

HTML에 이미지의 링크를 추가 할 수 있도록 서버에서 응답 메시지를 얻으려고 나는 그 문제를 알아 냈습니다. 몇 가지 이유로 Dropzone.options은 $ (function {}) 안에 있기 때문에 실행되지 않았습니다. 그래서 여기에 매력처럼 작동하는 버전이 있습니다

<!DOCTYPE html> 
<html lang="en" 
<head> 
    <meta charset="UTF-8"> 
    <title>Products</title 
    <!-- Bootstrap core CSS --> 
    <link href="assets/bootstrap/css/bootstrap.css" rel="stylesheet"> 

    <!-- Dropzone css--> 
    <link rel="stylesheet" href="assets/css/plugins/dropzone/dropzone.css"> 
    <link rel="stylesheet" href="assets/css/plugins/dropzone/basic.css"> 
</head> 
<body> 
    <div class="container" style="margin-top: 300px"> 
    <div class="well"> 

     <form action="/file/upload" class="dropzone" id="dropzoneForm"> 
     <div class="fallback"> 
      <input type="file" name="file" multiple="multiple"> 
     </div> 
     </form> 

    </div> 
    </div> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script src="assets/plugins/dropzone/dropzone.js"></script> 
    <script> 
    Dropzone.options.dropzoneForm = { 
     dictDefaultMessage: 'Drop file here or click to upload!!!!!!!!', 
     addRemoveLinks: true, 
     init: function() { 
     this.on("addedfile", function(file) { alert("Added file."); }); 
     } 
    }; 

    </script> 
</body> 
</html>

출처

2017-04-16 07:02:33

Dropzone.js 이벤트가 실행되지 않습니다.

답변

관련 문제