ajaz/php-dropzone-widget

DropzoneJs Extention for PHP

Maintainers

Details

github.com/ajazsaif/dropzone-js-php

Homepage

Source

Issues

Installs: 9

Dependents: 0

Suggesters: 0

Security: 0

Stars: 1

Watchers: 2

Forks: 0

Open Issues: 0

1.0.0 2021-05-05 19:40 UTC

Requires

  • php: >=5.6

MIT 4d919b25239692198cd4395a0094b3d4444cb0f8

  • ajaz <ajazaalam.woop@gmail.com>

phplaravelwidgetyii2dropzonedropzonejsdropzone jsphp-dropzonedropzone-jsdropzone-filedropzoneuploadphp-file-uploadphp dropzone widgetdrag drop image uploaddropzone js ajax upload

This package is auto-updated.

Last update: 2024-10-06 02:58:33 UTC

README

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);
}