vorst.ru - Статьи о задачах возникающих при создании сайта и их решении
Статьи из рубрики form

Поведение для загрузки файлов

Как быстро подключить загрузку файлов

Расширение yii2-uploader предлагает общий подход для загрузки и хранения файлов в приложении. Для того, чтобы с моделью были связаны файлы, например фотографии, достаточно подключить к модели поведение из расширения yii2-uploader.

При этом в модели не надо определять поле с типом file. Соответственно не надо обрабатывать это поле в контроллере.


Как написать unique валидатор

Пример валидатора для серверной и клиентской частей

Есть таблица цен на номера в пансионате. Цена зависит от различных параметров - номера, типа ценника, типа питания, варианта размещения, наличия или отсутствия лечения. Цена, для определенной комбинации значений этих параметров, может быть только одна.

Нужно записать правило проверки уникальности комбинации атрибутов как для обычной формы так и для ее модального варианта.


Как отсортировать картинки мышкой

Сортировка строк мышкой

Василий оставил комментарий в конце января: "Напишите, пожалуйста, статью, как массово загружать изображения через ajax с возможностью сортировки перетаскиванием."

Речь о расширении yii2-uploader, которое может загружать, сжимать, обрезать картинки для любой модели. Я писал о нем уже пару раз.

На тот момент этой функциональности не было. Собирался я долго. Но вот, наконец добавил требуемое. Теперь спешу написать несколько слов о процессе. Демо (при редактировании).


Как добавить атрибут к загруженному файлу

Добавление описания к файлу

Иногда важно определить дополнительную информацию для загружаемого файла. Например это может быть описание. В расширении yii2-uploader возможность добавить описание к файлу уже предусмотрена.

Кроме описания может быть добавлено и любое другое свойство. В предыдущем примере использовалось свойство when типа radio с двумя значениями - "до" и "после". Как добавить новое свойство?


Как сделать галерею фотографий "До и После"

Показ фотографий до и после момента времени

Представьте, что вы продаете курс похудания. Вам нужно наглядно представить результат вашего курса. Фото "До" и "После", что может быть лучшей иллюстрацией?

Как и в предыдущем примере примем, что участников ограниченное количество. Например 4. Забудем про похудающих - слишком скучно. Будем "работать" с кинозвездами. Для каждого можно загрузить только 4 фотографии. Таким образом всего 16 фото. Если загружены все 16 и кому-то захочется добавить "свои" фото, то придется что-то удалить. Демо.


Делаем демо для загрузки фото

Загрузка жестко определенного количества файлов

Чтобы показать, как работает загрузка изображений, нужно разрешить загружать изображения на свой сайт. Но, в этом случае, дисковое пространство может быть быстро исчерпано и нужно как-то удалять оставленный посетителями "мусор".

Например, можно устроить, что-то вроде надписи в столовой - "Уберите, пожалуйста, за собой посуду" (демо).


Редактирование и валидация модальной формы

Использование pop-up формы

Бывает, что количество полей в таблице не слишком велико и редактировать в модальном окне проще и нагляднее. Что необходимо, чтобы организовать стандартный набор операций - CReate, Update, Delete?



Поиск



Поведение для загрузки файлов

Как быстро подключить загрузку файлов

Расширение yii2-uploader предлагает общий подход для загрузки и хранения файлов в приложении. Для того, чтобы с моделью были связаны файлы, например фотографии, достаточно подключить к модели поведение из расширения yii2-uploader.

При этом в модели не надо определять поле с типом file. Соответственно не надо обрабатывать это поле в контроллере.


    Поделиться

Достигается это добавлением служебной модели, в которой хранится информация о загруженных через расширение yii2-uploader файлах.

Как это работает, можно посмотреть на примерах: фотографии по категориям, фотографии До & После.

И пример подключения.

Model

use sergmoro1\uploader\behaviors\HaveFileBehavior;
use sergmoro1\uploader\models\OneFile;
class Post extends ActiveRecord
{
  // sizes and subdirs of uploaded images
  public $sizes = [
    'original'  => ['width' => 2400, 'height' => 1600, 'catalog' => 'original'],
    'main'      => ['width' => 600,  'height' => 400,  'catalog' => ''],
    'thumb'     => ['width' => 120,  'height' => 80,   'catalog' => 'thumb'],
  ];
  /**
   * @inheritdoc
   */
  public function behaviors()
  {
    return array_merge(parent::behaviors(), [
      [
        'class'     => HaveFileBehavior::className(),
        'file_path' => '/files/post/',
      ],
    ]);
  }
  /**
   * @return array all files linked with the model
   */
  public function getFiles()
  {
    return $this->hasMany(OneFile::className(), ['parent_id' => 'id'])
      ->where('model=:model', [':model' => 'common\models\Post'])
      ->orderBy('created_at');
  }

View

Для загрузки разместите где-то в backend/views.

<?= \sergmoro1\uploader\widgets\Uploader::widget([
  'model'         => $model,
  'draggable'     => true,
  'appendixView'  => '/post/appendix.php',
  'cropAllowed'   => true,
]) ?>

Пример использования где-то во frontend/views.

<a data-fancybox="gallery" href="<?= $model->getImage('original') ?>" title="<?= $model->getFileDescription() ?>">
  <img src="<?= $model->getImage('thumb') ?>">
</a>

Заключение

В текущей версии была добавлена возможность загрузки нескольких файлов. Собственно поэтому и появился этот пост. Более подробное описание в расширении yii2-uploader.

Leave a comment

Only authorized users can leave comments. Please log in or pass a registration.