Implementing Dropzone.js and would like to have a onetime submit after all photos are added to the dropzone. This is running with PHP kohana inside a wamp server right now. For some reason I am unable to pass the photos to the php page.
Dropzone config on js
$(document).ready(function() {
Dropzone.options.dropzoneForm = {
// The camelized version of the ID of the form element
paramName: "files",
autoProcessQueue: false,
uploadMultiple: true,
parallelUploads: 100,
maxFiles: 100,
previewsContainer: ".dropzone-previews",
clickable: true,
dictDefaultMessage: 'Add files to upload by clicking or droppng them here.',
addRemoveLinks: true,
acceptedFiles: '.jpg,.pdf,.png,.bmp',
dictInvalidFileType: 'This file type is not supported.',
// The setting up of the dropzone
init: function () {
var myDropzone = this;
$("button[type=submit]").bind("click", function (e) {
e.preventDefault();
e.stopPropagation();
// If the user has selected at least one file, AJAX them over.
if (myDropzone.files.length !== 0) {
myDropzone.processQueue();
// Else just submit the form and move on.
} else {
$('#dropzone-form').submit();
}
});
this.on("successmultiple", function (files, response) {
// After successfully sending the files, submit the form and move on.
$('#dropzone-form').submit();
});
}
}
});
Form
<div id="photoContainer">
<form action="/inspections/uploadphotos" method="post"
enctype="multipart/form-data" class="dropzone dz-clickable dropzone-previews" id="dropzone-form">
</form>
<button type="submit" id="dz" name="dz" value="Submit " /> Submit Photos</button>
</div>
PHP Kohana
if (!empty($_FILES)) {
print_r($_FILES);
}
The problem is that $_Files is always empty. Can anyone provide some assistance on configuring this?
use something like this to check if $_FILE is set
if (file_exists($_FILES['file']['tmp_name']) || is_uploaded_file($_FILES['file']['tmp_name']))
Press F12 and see the network tab (preview) and click upload.php file u can see like this
The files array will always be empty when you click the submit button. Dropzone already submits the files via Ajax so to see the result of
print_r($_FILES);
you would need to view the result via the network panel using chrome dev tools (or another like it).To see what you submitted, just set the action url for your form to your desired function, and add
print_r($_FILES);
somewhere in that function, open up dev tools in chrome, then add a file in dropzone, and follow the steps in Steve Bals's answer to see your result.