Jasny File Input Bootstrap Widget + Local and Remote storage
Switch branches/tags
Nothing to show
Clone or download
Pull request Compare This branch is 10 commits ahead, 49 commits behind 2amigos:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
assets
behaviors
examples
models
providers
views
.gitignore
FileInput.php
FileInputAsset.php
LICENSE.txt
README.md
composer.json

README.md

FileInput Widget for Yii2

Renders a Jasny File Input Bootstrap widget.

Installation

The preferred way to install this extension is through composer.

Add github repository

    "repositories": [
        {
            "type": "git",
            "url": "https://github.com/mirocow/yii2-file-input-widget.git"
        }
    ]

and then

php composer.phar require --prefer-dist "mirocow/yii2-file-input-widget" "*"

or add

"mirocow/yii2-file-input-widget" : "*"

to the require section of your application's composer.json file.

Usage

Using a model:

    public function behaviors() {
        $behaviors = [          
            'fileupload' => [
                'class' => 'mirocow\fileinput\behaviors\UploadFileBehavior',
                'attributeName' => 'file'
            ],            
        ];
        
        return $behaviors;
    }

or use LocalStorage provider

    public function behaviors() {
        $behaviors = [          
            'fileupload' => [
                'class' => 'mirocow\fileinput\behaviors\UploadFileBehavior',
                'provider' => 'mirocow\fileinput\providers\LocalStorage',
                'savePathAlias' => '@app/web/uploads',
                'publicPath' => 'uploads',
                'attributeName' => 'name',
                'multiple' => true,
                'fileTypes' => $this->fileTypes,
            ],            
        ];
        
        return $behaviors;
    }

or use Uploads.Im Storage provider

    public function behaviors() {
        $behaviors = [          
            'fileupload' => [
                'class' => 'mirocow\fileinput\behaviors\UploadFileBehavior',
                'provider' => 'mirocow\fileinput\providers\UploadsImStorage',
                'savePathAlias' => '@app/web/uploads',
                'publicPath' => 'uploads',
                'attributeName' => 'name',
                'multiple' => true,
                'fileTypes' => $this->fileTypes,
            ],            
        ];
        
        return $behaviors;
    }

or extendig model File

Example:

<?php

    namespace app\modules\core\models;

    use mirocow\fileinput\models\File;

    class Image extends File
    {


    }

Using a view:

Example 1:

use mirocow\fileinput\FileInput;

<?=FileInput::widget([
    'model' => $model,
    'name' => 'Image[name][]', // image is the attribute
    // using STYLE_IMAGE allows me to display an image. Cool to display previously
    // uploaded images
    'thumbnail' => $model->getThumbnailUrl(),
    'style' => FileInput::STYLE_IMAGE
]);?>

Example 2:

<?= FileInput::widget([
  'name' => 'Image[name][]',
  'style' => FileInput::STYLE_INPUT,
  //'style' => FileInput::STYLE_CUSTOM,
  //'customView' => __DIR__ . '/widgets/file_input.php',
  'addMoreButton' => true,
  'buttonCaption' => 'Дбавить еще',
])?>

Using a view: JQuery Ajax Upload

Js file

$('#my-form form').submit(function(){

    var form = new FormData();

    $.each($('#data-form :input'), function(i, file) {
        var field_name = this.name;

        if(this.name) {
          if ($(this)[0].files) {
            $.each($(this)[0].files, function (i, file) {
              if(file.size) {
                form.append(field_name, file);
              }
            });
          } else {
            var v = $(this).val();
            if(v) {
              form.append(field_name, v);
            }
          }
        }
    });

    $.ajax({
        type: "POST",
        url: path,
        data: form,
        cache: false,
        contentType: false,
        processData: false

    }).done(function( msg ) {

      // something...

    }).fail(function(msg){
        
      // Error  
        
    });

    return false;
});

Html template form

<form class="form-horizontal" enctype="multipart/form-data" id="data-form">

    <div class="col-xs-8">

        <div class="form-group">
            <textarea name="Order[comment]" class="form-control" rows="3" placeholder="Commet"></textarea>

            <br>

            <?= FileInput::widget([
              'name' => 'Image[name][]',
              'style' => FileInput::STYLE_INPUT,
              //'style' => FileInput::STYLE_CUSTOM,
              //'customView' => __DIR__ . '/widgets/file_input.php',
              'addMoreButton' => true,
              'buttonCaption' => 'Add more
            ])?>

            <button type="submit" class="btn btn-success btn-sm2">Submit</button>
        </div>
    </div>
</form>

Sql

CREATE TABLE `tbl_file` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `user_id` int(11) NOT NULL COMMENT 'ID профиля',
  `name` varchar(255) NOT NULL DEFAULT '' COMMENT 'Файл',
  `original_name` varchar(255) NOT NULL DEFAULT '',
  `path` varchar(255) NOT NULL DEFAULT '' COMMENT 'Путь до файла',
  `create_time` datetime DEFAULT NULL COMMENT 'Дата создания',
  `update_time` datetime DEFAULT NULL COMMENT 'Дата обновления',
  `entity_type` varchar(255) NOT NULL DEFAULT '' COMMENT 'Тип сущности',
  `entity_id` int(11) NOT NULL COMMENT 'ID сущности (Анкета, Запрос, Марка итд)',
  `mime_type` varchar(20) NOT NULL COMMENT 'Mime тип',
  `order` int(11) NOT NULL DEFAULT '0' COMMENT 'Сортировка',
  `data` text COMMENT 'Данные',
  PRIMARY KEY (`id`),
  KEY `fk_file_special_mark_id` (`entity_id`),
  KEY `fk_file_user_id` (`user_id`),
  CONSTRAINT `fk_file_user_id` FOREIGN KEY (`user_id`) REFERENCES `tbl_user` (`id`) ON DELETE NO ACTION ON UPDATE NO ACTION
) ENGINE=InnoDB AUTO_INCREMENT=8 DEFAULT CHARSET=utf8;