README

俄语版本这里

使用知名库DropZone.js便捷下载文件的小部件。

这个小部件与许多小部件不同之处在于

1. 所有功能都正常，包括将PHP数组转换为JS对象。
2. 不会像大多数yii2小部件那样将脚本放入HTML文档的body中

安装

安装此扩展的首选方式是通过composer。

运行以下命令：

composer require dastanaron/yii2-dropzone-widget "@dev" --prefer-dist 

之后，您需要配置配置文件。但仅在您使用生成JS文件的小部件（而不是在HTML的body中发布它）时才需要这样做。

首先将模块添加到main.php

<?php
    'modules' => [       
        //other modules //--//--//--//
        'dynamikjs' => [
            'class' => 'dastanaron\dropzone\DynamicJSModule'
        ],
    ]

用法

<?=dastanaron\dropzone\DropZoneWidget::widget([
        'id' => 'myDropZone', // ID on the div element
        'site_url' => 'http://site.com/', //If you are using JS file generation, you must specify
        'generateJSFile' => true, //Generate js file (the default is on)
        'options'=> [
            'url' => '/file-upload/image-upload', //Where to send a request to save the file
            'maxFiles' => 1, //The maximum number of files
            'acceptedFiles' => 'image/*', // MIME - file types
        ],
        'events' => [
            'success' => 'function(event, response) {
                console.log("success")
                $("input#inputid").val(response.id);
            }',
        ],
]);?>

在选项数组中，您可以指定dropZoneLib中可用的所有选项，[选项列表]（《http://www.dropzonejs.com/#configuration-options》）

在events数组中，您可以传递函数来处理dropZone.on ("event", function () {})键将是您的事件，而函数是传递给处理指定事件的函数。dropZone事件在这里有说明（《http://www.dropzonejs.com/#event-list》）

数据接受控制器示例，《https://yiiframework.cn/doc-2.0/guide-input-file-upload.html》详情见此处

<?php

use Yii;
use yii\web\Controller;
use backend\models\UploadImage;
use yii\web\UploadedFile;

class DynamikjsController extends Controller
{
 public function actionImageUpload()
    {
        $model = new UploadImage();

        if (Yii::$app->request->isPost) {
            $model->file = UploadedFile::getInstanceByName('file');
            if ($model->upload()) {
                return 'ok';
            }
        }

        Yii::$app->response->setStatusCode(400);
        return 'error';
    }
}