Валидация файлов в Tickets

Вопрос собственно очень простой. В Tickets при работе с фронтенда есть поле прикрепеления фото:

<div class="file-upload">
		    <div class="ticket-form-files">
		        [[+files]]
		    </div>
		    <span class="error"></span>
	</div>

не показывает внизу поля случаи, когда фото не прикреплено и отправляет тике с незаполненным фото. Такого быть не должно. Как показывать пользователю уведомление о незаполненности + несоответствии фото, критериям, заданным в настройках Tickets?

Антон

17 декабря 2020, 16:52

1 099

Комментарии: 8

Артур Шевченко

17 декабря 2020, 21:14

docs.modx.pro/komponentyi/tickets/snippetyi/ticketform последний параметр validate. Там же есть примеры оформления чанка. А сам валидатор можно взять тут.

Антон

17 декабря 2020, 22:03

проблема в том, что [[+files]] — это не TV -шка

Артур Шевченко

17 декабря 2020, 22:11

И что? Это input, у него может быть name, а значит его можно записать в validate

'validate' => 'upload:required:customValidator'

Антон

17 декабря 2020, 22:18

я вставляю в вызов:

[[!TicketForm?
&allowedFields=`parent,profile-status,name,gender,phone,email,location`
&tplFormCreate=`tickets.form.create.tpl`
&tplFormUpdate=`tickets.form.update.tpl`
&redirectUnpublished=`11`
&redirectDeleted=`11`
&tplTicketEmailBcc=`tpl.Tickets.ticket.email.bcc`
&validate=`
pagetitle:required,
 .......
files:required:customValidator`
]]

В саму форму:

<form class="well create" enctype="multipart/form-data" method="post" action="" id="ticketForm">
....
        <div class="file-upload">
		    <div class="ticket-form-files">
		        [[+files]]
		    </div>
		    <span class="error"></span>
	</div>

и беру снипет для проверки нескольких файлов (массива) с

не реагирует вообще никак

Артур Шевченко

17 декабря 2020, 23:13

Я посмотрел, похоже надо исходники править, в шаблоне нет inout'а он вставляется динамически, значит надо изобретать велосипед, но более простой вариант проверять на фронте. В этом файле assets/components/tickets/js/web/files.js в районе 107 строки написать примерно так

$('.jsFileInput').change(function () {
            $('.error_photos').text('');
            var input = $(this)[0];
            if (input.files && input.files[0]) {
                if (input.files[0].type.match('image.*')) {
                    var reader = new FileReader();
                    reader.onload = function (e) {
                        $('.jsAvatar').removeClass('no-avatar').css('background-image', 'url("' + e.target.result + '"');
                    }
                    reader.readAsDataURL(input.files[0]);
                } else {
                    $('.error_photos').text('Изображение должно быть одного из следующих форматов: jpg,png,jpeg');
                }
            } else {
                console.log('хьюстон у нас проблема');
            }
        });

Антон

17 декабря 2020, 23:23

если упроститься только до проверки подгруженности определенного количества файлов в поле (поле все-таки мультизагрузочное), что нужно для этого в files.js поправить?
Есть интересный пример сниппета, который проверяет количество файлов (до 3х):

<?php
$output = true;
$count_files = 0; // счётчик файлов
$errorMsg = ''; // сообщение об ошибке
$allowedExt = array('jpg','png'); // разрешённые расширения файлов
$maxFileSize = 512 * 1024; // максимальный размер файла (512 Кбайт)
if (isset($_FILES[$key])) {
  foreach ($_FILES[$key]["error"] as $fkey => $error) {
    if ($error == UPLOAD_ERR_OK) {
      $fileName = basename($_FILES[$key]['name'][$fkey]);
      $fileExt = mb_strtolower(pathinfo($fileName, PATHINFO_EXTENSION));
      $fileSize = filesize($_FILES[$key]['tmp_name'][$fkey]);
      if (!in_array($fileExt, $allowedExt)) {
        if (!empty($errorMsg)) {
          $errorMsg .= '; ';
        }
        $errorMsg .= 'Файл ' . $fileName . ' имеет не разрешённый тип.';
        continue;
      }
      if ($fileSize > $maxFileSize) {
        if (!empty($errorMsg)) {
          $errorMsg .= '; ';
        }
        $errorMsg .= 'Файл '. $fileName .' имеет не разрешённый размер.';
        continue;
      }
      $count_files++; // увеличиваем на 1
    } else {
      if (!empty($errorMsg)) {
        $errorMsg .= '; ';
      }
      $errorMsg .= 'Произошла ошибка при загрузке файла ' . $fileName .' на сервер.';
    }
  }
}
if ($count_files < 3) {
  if (!empty($errorMsg)) {
    $errorMsg .= '; ';
   }
   $errorMsg .= 'К сообщению необходимо прикрепить 3 файла!';
}
if (!empty($errorMsg)) {
  $validator->addError($key,$errorMsg);
  $output = false; // возвращаем false
}
return $output;

но в сочетании files:required:snippet он ни фига не работает

Антон

17 декабря 2020, 23:24

и неужели никто, пользуясь тикетами, никогда не озадачивался вопросом подгружены ли фото в поле или нет? и нет стандартных способов проверки этого всего?

Артур Шевченко

18 декабря 2020, 00:12

Я пользуюсь, и скинул скрипт, которым в последнем проекте проверял файлы, но правда не для тикетов, для них мне обязательно нужен только один файл и я его загружаю в отдельное ТВ и для него я сделал отдельное поле на фронте, куда вставляю один из загруженных пользователем файлов и которое проверяю через validate. Вы можете сделать так же, т.е. если нужно чтобы был загружен как минимум один файл сделайте отдельный input и в файле files.js при успешной загрузке вставляйте значение в дополнительный input, и этот input проверяйте в параметре validate.

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.

Валидация файлов в Tickets

Комментарии: 8

Здесь упомянуты