2amigos / yii2-file-upload-widget
Blueimp file upload widget for the Yii framework
Installs: 1 486 272
Dependents: 40
Suggesters: 0
Security: 0
Stars: 251
Watchers: 39
Forks: 148
Open Issues: 38
Type:yii2-extension
Requires
- 2amigos/yii2-gallery-widget: ^1.0
- bower-asset/blueimp-file-upload: ^9.9
- yiisoft/yii2: ^2.0.0
- yiisoft/yii2-bootstrap: ^2.0.0
Requires (Dev)
- phpunit/phpunit: ~4.0
README
Renders a BlueImp jQuery File Upload plugin. That plugin integrates multiple file selection, drag&drop support, progress bars, validation and preview of images.
Installation
The preferred way to install this extension is through composer.
Either run
$ composer require 2amigos/yii2-file-upload-widget:~1.0
or add
"2amigos/yii2-file-upload-widget": "~1.0"
to the require
section of your composer.json
file.
Usage
The widget comes with two flavors:
- FileUpload: Basic and BasicPlus
- FileUploadUI: BasicPlus UI
<?php use dosamigos\fileupload\FileUpload; // without UI ?> <?= FileUpload::widget([ 'model' => $model, 'attribute' => 'image', 'url' => ['media/upload', 'id' => $model->id], // your url, this is just for demo purposes, 'options' => ['accept' => 'image/*'], 'clientOptions' => [ 'maxFileSize' => 2000000 ], // Also, you can specify jQuery-File-Upload events // see: https://github.com/blueimp/jQuery-File-Upload/wiki/Options#processing-callback-options 'clientEvents' => [ 'fileuploaddone' => 'function(e, data) { console.log(e); console.log(data); }', 'fileuploadfail' => 'function(e, data) { console.log(e); console.log(data); }', ], ]); ?> <?php use dosamigos\fileupload\FileUploadUI; // with UI ?> <?= FileUploadUI::widget([ 'model' => $model, 'attribute' => 'image', 'url' => ['media/upload', 'id' => $tour_id], 'gallery' => false, 'fieldOptions' => [ 'accept' => 'image/*' ], 'clientOptions' => [ 'maxFileSize' => 2000000 ], // ... 'clientEvents' => [ 'fileuploaddone' => 'function(e, data) { console.log(e); console.log(data); }', 'fileuploadfail' => 'function(e, data) { console.log(e); console.log(data); }', ], ]); ?> <?php // action examples public function actionImageUpload() { $model = new WhateverYourModel(); $imageFile = UploadedFile::getInstance($model, 'image'); $directory = Yii::getAlias('@frontend/web/img/temp') . DIRECTORY_SEPARATOR . Yii::$app->session->id . DIRECTORY_SEPARATOR; if (!is_dir($directory)) { FileHelper::createDirectory($directory); } if ($imageFile) { $uid = uniqid(time(), true); $fileName = $uid . '.' . $imageFile->extension; $filePath = $directory . $fileName; if ($imageFile->saveAs($filePath)) { $path = '/img/temp/' . Yii::$app->session->id . DIRECTORY_SEPARATOR . $fileName; return Json::encode([ 'files' => [ [ 'name' => $fileName, 'size' => $imageFile->size, 'url' => $path, 'thumbnailUrl' => $path, 'deleteUrl' => 'image-delete?name=' . $fileName, 'deleteType' => 'POST', ], ], ]); } } return ''; } public function actionImageDelete($name) { $directory = Yii::getAlias('@frontend/web/img/temp') . DIRECTORY_SEPARATOR . Yii::$app->session->id; if (is_file($directory . DIRECTORY_SEPARATOR . $name)) { unlink($directory . DIRECTORY_SEPARATOR . $name); } $files = FileHelper::findFiles($directory); $output = []; foreach ($files as $file) { $fileName = basename($file); $path = '/img/temp/' . Yii::$app->session->id . DIRECTORY_SEPARATOR . $fileName; $output['files'][] = [ 'name' => $fileName, 'size' => filesize($file), 'url' => $path, 'thumbnailUrl' => $path, 'deleteUrl' => 'image-delete?name=' . $fileName, 'deleteType' => 'POST', ]; } return Json::encode($output); }
Please, check the jQuery File Upload documentation for further information about its configuration options.
Using the Actions
TODO
Testing
$ ./vendor/bin/phpunit
Contributing
Please see CONTRIBUTING for details.
Credits
License
The BSD License (BSD). Please see License File for more information.
web development has never been so fun
www.2amigos.us