Skip to content

Latest commit

 

History

History
98 lines (86 loc) · 6.34 KB

Readme.md

File metadata and controls

98 lines (86 loc) · 6.34 KB
Raw

FileInput

Пример использования

<?=$form->field($formModel, 'photos')->widget(FileInput::class, [
    'options'           => [
      'accept'   => 'image/*',
      'multiple' => TRUE,
    ],
    'deletionInputName' => 'photos_to_delete[]',
    'pluginOptions'     => [
      'showMsgDropZone'       => TRUE,
      'msgDropZone'           => 'Перетащите файлы сюда',
      'allowedFileExtensions' => [
        'jpg',
        'jpeg',
        'gif',
        'png',
      ],

      'required'              => TRUE,
      'msgFileRequired'      => 'Добавьте дополнительные фото.',
      'initialPreview'        => TRUE,
      'initialPreviewConfig'  => [
        'id'          => 'id',
        'path'        => 'file',
        'useThumbs'   => TRUE,
        'thumbWidth'  => 282,
        'thumbHeight' => 282,
        'filePath'    => '/photos',
        'thumbsPath'  => '/thumbs',
      ],

      'minFileCount'          => 2,
      'maxFileCount'          => 4,
      'minFileSize' => 100, //Kb
      'maxFileSize' => 2000, //Kb
      
      'minImageHeight' => 100, //Px
      'maxImageHeight' => 1000, //Px
      'minImageWidth' => 100, //Px
      'maxImageWidth' => 1000, //Px

      'uploadContainerClasses' => ['one-class', 'two-class'],
      'dropZoneClasses' => ['one-class', 'two-class'],
      'previewClasses' => ['one-class', 'two-class']
    ],
]);
?>

Параметры

  • options - массив параметров, предающихся непосредственно в тег input
    • accept - Устанавливает фильтр на типы файлов, которые вы можете отправить через поле загрузки файлов (http://htmlbook.ru/html/input/accept)
    • multiple - мультизагрузка файлов. Влияет на внешний вид инпута и атрибут name. при 'multiple' => TRUE при получении файла следует использовать UploadedFile::getInstances() , иначе UploadedFile::getInstance()
  • deletionInputName - имя поля, в котором будет передаваться список файлов для удаления (в режиме редактирования). Необязательный параметр. По умолчанию равен attribute + '_to_delete[]'
  • pluginOptions - массив настроек виджета
    • showMsgDropZone - Необязательный параметр. показывать текст в поле перетаскивания. По умолчанию TRUE.
    • msgDropZone - Необязательный параметр. текст в поле перетаскивания. По умолчанию "Перетащите файлы сюда".
    • allowedFileExtensions - массив разрешенных расширений файлов
    • required - Обязательный параметр. По умолчанию FALSE
    • msgFileRequired - Необязательный параметр. Сообщение о незаполненном инпуте (при required === TRUE)
    • initialPreview - Показывать превью загруженных ранее файлов (в режиме редактирования). По умолчанию TRUE
    • initialPreviewConfig - конфигурация превью (при initialPreview === TRUE)
      • id: атрибут модели, хранящий идентификатор. По умолчанию "id"
      • path: атрибут модели, хранящий путь к файлу. По умолчанию "file"
      • filePath: Префикс для url файла (Например '/photos'). По умолчанию пустая строка,
      • useThumbs: Использовать генерацию превью, если доступно. По умолчанию FALSE
      • thumbsPath: Префикс для url превью. По умолчанию "/thumbs" (при useThumbs === TRUE)
      • thumbWidth: Ширина превью в px (при useThumbs === TRUE)
      • thumbHeight: Высота превью в px (при useThumbs === TRUE)
    • maxFileCount - Обязательный параметр. Максимальное кол-во загружаемых файлов
    • minFileCount - Необязательный параметр. Минимальное кол-во загружаемых файлов
    • maxFileSize - Необязательный параметр. Максимальный размер файла в kb
    • minFileSize - Необязательный параметр. Минимальный размер файла в kb
    • minImageHeight - Необязательный параметр. Минимальная высота в px. Только для изображений.
    • maxImageHeight - Необязательный параметр. Максимальная высота в px. Только для изображений.
    • minImageWidth - Необязательный параметр. Минимальная ширина в px. Только для изображений.
    • maxImageWidth - Необязательный параметр. Максимальная ширина в px. Только для изображений.
    • uploadContainerClasses - Необязательный параметр. Массив дополнительных классов для .wf-upload-container
    • dropZoneClasses - Необязательный параметр. Массив дополнительных классов для .wf-drop-zone
    • previewClasses - Необязательный параметр. Массив дополнительных классов для .wf-preview

Методы

  • $('#input_id').wfileinput('getFileCount') - количество файлов в инпуте (включая добавленные ранее)
  • $('#input_id').wfileinput('lock') - заблокировать
  • $('#input_id').wfileinput('unlock') - разблокировать

События

  • $('#input_id').on('onFileAdd', () => { // }) - файл добавлен
  • $('#input_id').on('onFileRemove', () => { // }) - файл удален
  • $('#input_id').on('onFileReplace', () => { // }) - файл заменен