Home is for the experience. Projects are for the ones who are interested!

How To Trigger Error In DropZone From Backend PHP

How To Trigger Error In DropZone From Backend PHP

If you already used dropzone or you are tring to implement it in your website you will notice that you can't trigger error in the dropzone. In this tutorial I will show you how to trigger error messages in dropzone from your controller in php. For this example we will use the following dropzone html structure:

<div class="custom_dropzone loadDropzone" name="lightdata_document">
                          <div class="dz-message" data-dz-message><p>ADD YOUR FILES</p><span>You can load more than one file.</span></div>
                        </div>

As you can see I don't use the class id dropzone because, if I do the dropzone will automatically init so I won't have the control I need on scripts, so I need to init it using jquery using the following code:

jQuery('.loadDropzone').dropzone({
    paramName: 'files',
    url: link,
    dictDefaultMessage: "Insert your files",
    clickable: true,
    autoDiscover:false,
    uploadMultiple: false,
    addRemoveLinks: true,
    init: function(){
    	this.on("sending", function(file, xhr, formData){
           
    	});
        this.on("success", function(file, response){
        	
        });
        this.on("error", function(file, message2){
        	alert(message2);
        });
    }
});

Using the above code you will init the dropzone and there you have main callbacks sending, success and error. Now we need to send those message from backend depending on what's going on at upload process. So the upload function will look like this:

public function makeUpload($file, $project_id, $field_name, $step){
  if(!empty($file)){
    $success_files = array();
    $file_name = $file['name'];
    $rand_number = rand(0, 900);
    $temp = $file['tmp_name'];
    $file_object = array();
    $file_object['name'] = $file['name'];
    $file_object['type'] = $file['type'];
    $file_object['tmp_name'] = $file['tmp_name'];
    $file_object['error'] = $file['error'];
    $file_object['size'] = $file['size'];
    
    if ($error = ImageManager::validateUpload($file_object)) {
        header('HTTP/1.1 500 Internal Server Error');
      		header('Content-type: text/plain');
        exit($error);
    } else {
    		$ext = substr($file_name, strrpos($file_name, '.') + 1);
      $file_name = substr($file_name,0,strrpos($file_name,'.'));
        	$file_name = $file_name.'_'.$rand_number.'.'.$ext; 
      if (!file_exists(_PS_MODULE_DIR_.'dashboard'.DIRECTORY_SEPARATOR.'files'.DIRECTORY_SEPARATOR.'project_'.$project_id)) {
          mkdir(_PS_MODULE_DIR_.'dashboard'.DIRECTORY_SEPARATOR.'files'.DIRECTORY_SEPARATOR.'project_'.$project_id, 0777, true);
      }
      if (!move_uploaded_file($temp, _PS_MODULE_DIR_.'dashboard'.DIRECTORY_SEPARATOR.'files'.DIRECTORY_SEPARATOR.'project_'.$project_id.DIRECTORY_SEPARATOR.$file_name)) {
        
        header('HTTP/1.1 500 Internal Server Error');
      		header('Content-type: text/plain');
        exit('An error occurred while attempting to upload the file.');
      }
      DB::getInstance()->insert('project_files', array(
        'id_project'       => (int)$project_id,
        'step'             => (int)$step,
        'file_name'        => pSQL($file_name),
        'input_field_name' => $field_name
      ));
      $success_files = array(
        'success' => true,
        'message' => 'Your File has been uploaded', 
        'file_id' => Db::getInstance()->Insert_ID(), 
        'file_name' => $file_name,
        'file_path' => $this->base_path().'/modules/dashboard/files/project_'.$project_id.'/'.$file_name
      );
      return json_encode($success_files);
      
    }
  }
}

In the above function you have all examples you need to implement this functionality, because I added an insert function and I send back to the client error messages but success one too. In order the error to reach the dropzone you need to send back a 500 error with a custom message, you can add what message you want, but is very important to send 500 Internal Server Error in order to dropzone to know that an error occured. I didn't test with other errors but you can test it. For this example I have used Prestashop CMS but don't worry the code should work on any CMS or framework. If you will use the above code don't forget to delete extra parameters and change the uploaoded files path. This is one of the methods through which you can trigger an error in dropzone. 

Leave a Reply

Your email address will not be published. Required fields are marked *