LaravelPackages.net
Acme Inc.
Toggle sidebar
ajaz/php-dropzone-widget

DropzoneJs Extention for PHP

12
1
1.0.0
About ajaz/php-dropzone-widget

ajaz/php-dropzone-widget is a Laravel package for dropzonejs extention for php. It currently has 1 GitHub stars and 12 downloads on Packagist (latest version 1.0.0). Install it with composer require ajaz/php-dropzone-widget. Discover more Laravel packages by ajaz or browse all Laravel packages to compare alternatives.

Last updated

PHP Dropzone

DropzoneJs widget for PHP, you can easily implement Dropzone.js library with you PHP application

A port of DropzoneJs for dropzone js configuration

Installation

The preferred way to install this extension is through composer.

Either run

php composer.phar require --prefer-dist ajaz/php-dropzone-widget

or add

"ajaz/php-dropzone-widget": "*"

to the require section of your composer.json file.

Usage

Once the extension is installed, simply use it in your code by to create Ajax upload area (JQuery is required) : Load the following assets in your header

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>How to Upload a File using Dropzone.js with PHP Widget</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>        
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.7.0/dropzone.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.7.0/dropzone.min.js"></script>
</head>
<div class="container">
<?php 
use Ajaz\widget\Dropzone;
require 'vendor/autoload.php';
$dropzone = new Dropzone([
    'uploadUrl'=>'upload.php', //your server side upload action
    'options'=>[
        'maxFilesize'=> '2',
        'acceptedFiles'=>'image/*',
        'dictDefaultMessage'=>'DRAG & DROP Your files'
    ],
    'clientEvents' => [
        'complete' => "function(file){console.log(file)}",
        'removedfile' => "function(file){alert(file.name + ' is removed')}"
    ],
]);
$dropzone->run();
?>
</div>

To pass options : (More details at dropzonejs official docs )

Example of upload method on server side:

//upload.php
$folder_name = 'upload/';

if(!empty($_FILES))
{
 $temp_file = $_FILES['file']['tmp_name'];
 $location = $folder_name . $_FILES['file']['name'];
 move_uploaded_file($temp_file, $location);
}
Comments