dropzone with cakephp 2.5

Question

My issue is that I want to integrate dropzone with cakephp 2.5; but after form submit $this->request->data['pic'] returns empty array. But in drop zone when I add the image; it shows success image. Second; File not moves to target path "APP.'webroot'.DS.'uploadedpics'.DS"

Please check my code below.

I have included dropzone css and js files in default layout

echo $this->Html->css('dropzone/basic');
echo $this->Html->css('dropzone/dropzone'); 

echo $this->Html->script('js/dropzone/dropzone');
echo $this->Html->script('js/dropzone/dropzone.min');
echo $this->Html->script('js/dropzone/dropzone-amd-module');
echo $this->Html->script('js/dropzone/dropzone-amd-module.min');

My HTML page have form and dropzone js:-

<form method="post" action="/domain/controller/addpics" class="dropzone" id="mydropzone" enctype='multipart/form-data'> 
<div id="dropzonePreview"></div> <!--// this will the dropzone drag and drop section .notice we have given it an id dropzonePreview .-->
<input type="button" id="sbmtbtn" value="submit"/>
</form>

<script>
Dropzone.options.mydropzone = {
// url does not has to be written if we have wrote action in the form tag but i have mentioned here just for convenience sake 
url: '/domain/controller/addpics', 
addRemoveLinks: true,
autoProcessQueue: false, // this is important as you dont want form to be submitted unless you have clicked the submit button
autoDiscover: false,
paramName: 'pic', // this is optional Like this one will get accessed in php by writing $_FILE['pic'] // if you dont specify it then bydefault it taked 'file' as paramName eg: $_FILE['file'] 
previewsContainer: '#dropzonePreview', // we specify on which div id we must show the files
clickable: false, // this tells that the dropzone will not be clickable . we have to do it because v dont want the whole form to be clickable 
accept: function(file, done) {
console.log("uploaded");
done();
},
error: function(file, msg){
alert(msg);
},
init: function() {

var myDropzone = this;
//now we will submit the form when the button is clicked
$("#sbmtbtn").on('click',function(e) {
e.preventDefault();
myDropzone.processQueue(); // this will submit your form to the specified action path
// after this, your whole form will get submitted with all the inputs + your files and the php code will remain as usual 
//REMEMBER you DON'T have to call ajax or anything by yourself, dropzone will take care of that
});

} // init end

};
</script>

Controller code:-

function addpics() {
  $tempFile = $this->request->data['pic']['tmp_name'];          
  $targetPath = APP.'webroot'.DS.'uploadedpics'.DS;
  $targetFile =  $targetPath. $this->request->data['pic']['name'];
  move_uploaded_file($tempFile,$targetFile);
}

Regards

@CFeo: I guess there is no harm in trying out the code yourself... it should hardly take 5 min at your slowest pace... — Fr0zenFyr

Quy Le Quy Le · Accepted Answer · 2014-08-26T15:41:21

When you use dropzone and submit form to server,
In Controller you can get information of file by use source as bellow

$file = $this->params->form['file'];

good luck

dropzone with cakephp 2.5

2 Answers