ruvents / yii2-file-upload-widget
Blueimp file upload widget for the Yii framework
Installs: 16
Dependents: 0
Suggesters: 0
Security: 0
Stars: 1
Watchers: 3
Forks: 139
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 // with UI use dosamigos\fileupload\FileUploadUI; ?> <?= 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() { $imageFile = UploadedFile::getInstanceByName('Transport[name]'); $directory = \Yii::getAlias('@frontend/web/img/temp') . DIRECTORY_SEPARATOR . Yii::$app->session->id . DIRECTORY_SEPARATOR; if (!is_dir($directory)) { mkdir($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){ $path = '/img/temp/' . Yii::$app->session->id . DIRECTORY_SEPARATOR . basename($file); $output['files'][] = [ 'name' => basename($file), 'size' => filesize($file), "url" => $path, "thumbnailUrl" => $path, "deleteUrl" => 'image-delete?name=' . basename($file), "deleteType" => "POST" ]; } return Json::encode($output); }
Please, check the jQuery File Upload documentation for further information about its configuration options.
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