Notes on everything: If you want to expand the dropzone to whole body

Saturday, September 16, 2017

If you want to expand the dropzone to whole body

If you want to expand the dropzone to whole body:

<head>
<link rel="stylesheet" type="text/css" href="./script/dropzone.min.css">
</head>
<form>
<div id="dZUpload" class="dropzone">
<div class="dz-default dz-message"></div>
</div>
</form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="./script/dropzone.min.js"></script>
<script>
Dropzone.autoDiscover = false;
$(document).ready(function () {
$("body").dropzone({
url: "http://192.168.1.1/upload.php", //Your URL to upload
addRemoveLinks: true,
previewsContainer: '#dZUpload',
clickable: '#dZUpload',
//If you are using cakephp 3, use this token.
/*headers: {
'X-CSRFToken': $('meta[name="token"]').attr('content')
},*/
success: function (file, response) {
var imgName = response;
//For animation
file.previewElement.classList.add("dz-success");
//To add id to the previews
//file.previewElement.id = response.id;
console.log("Successfully uploaded :" + imgName);
}
});
});
</script>