|
|---------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| Сообщать «Название обязательно» | Блокировать кнопку, пока не задано название |
-| Сообщать «Название невалидно» | Автоматически заменить пробелы на _, чтобы все было валидно |
-| Сообщать «Введите число» | Использовать контролы ввода чисел |
+| Сообщать, что поле ввода обязательно для заполнения | Блокировать кнопку отправки формы до тех пор, пока поле не заполнено |
+| Сообщать, что в поле введены неподходящие данные | Преобразовать введенные данные в корректные. Например, автоматически заменить все пробелы на знак подчеркивания |
+| Заранее сообщать, какие данные нужно вводить в поле | Использовать контрол, которые не позволяет вводить неправильные данные. Например, специальное поле для ввода чисел |
### Когда проверять на ошибки
Есть три способа проверить верность введенных значений:
1. Во время ввода значения
-2. По уходу с поля (потере фокуса)
+2. По уходу с поля (по потере фокуса)
3. После отправки формы
#### Во время ввода значения
-Иногда можно предотвратить неверный ввод значений, в таких случаях нужно запрещать ввод определённых символов, например букв в IP-адрес или в другой числовой формат. В этом случае запрещенные символы не вводятся и показывается желтый тултип на 3 секунды, после этого скрывается.
+В тех случаях, когда заранее известно, какие символы точно не подходят для ввода в поле, мы можем предотвратить ввод некорректных значений. Для этого нужно запрещать ввод определенных символов, например букв в IP-адрес. При этом запрещенные символы не вводятся и показывается желтый тултип.
-##### Диапазоны значений
-Делайте так, чтобы нельзя было задать неправильно. Например, при вводе периода можно менять местами значения «С» и «По», если значение в «По» будут указаны раньше значения в «С».
-
-#### По уходу с поля
-Проверка на верность введеных значений в поле выполняется по потере фокуса (onblur), поля получают состояние ошибки. Поля получают нормальное состояние по изменению значения (onchange).
+#### По уходу с поля (по потере фокуса)
+Если требования к значениям в поле относительно сложные (например, это IP-адрес или адрес эл. почты), то поле не должно получать состояние ошибки во время ввода, чтобы не сбивать пользователя с толку. Валидация в таких случаях выполняется по потере фокуса. Поле возвращается к нормальному состоянию после изменения значения.
Если у поля есть подпись, то текст ошибки выводится под подписью
- Пустые обязательные поля по onblur не получают состояние ошибки
+ Пустые обязательные поля не получают состояние ошибки по потере фокуса.
##### Составные поля
-Если поля нуждаются в валидации [во время ввода значения](/validation/overview#Во-время-ввода-значения) или [по уходу с поля](/validation/overview#По-уходу-с-поля), то сначала выполняются эти проверки. После того как все значения валидны, срабатывает валидация на все поля, поля выделятся фоном и внизу пишется сообщение об ошибке.
+Когда значения в нескольких полях тесно связаны между собой (например, края диапазонов), нужно проверять их все вместе. Для этого нужно сначала отдельно проверить все поля [во время ввода значения](/validation/overview#Во-время-ввода-значения) и [по уходу с поля](/validation/overview#По-уходу-с-поля). Если по-отдельности все значения валидны, срабатывает общая валидация на несколько полей: каждое поле не получает состояние ошибки, но все поля вместе выделяются фоном и внизу выводится общее сообщение.
#### После отправки формы
##### Глобальная ошибка
-При самой аккуратной валидации отдельных полей всегда что-то может пойти не так: пропадет соединение с БД, другой пользователь изменит данные системы и т. д. Если ошибка возникла или выявилась после нажатия на терминальные кнопки и не связана с ошибками в полях, то такая ошибка показывается алертом над формой и страница прокручивается до алерта с ошибкой.
+При самой аккуратной валидации отдельных полей всегда что-то может пойти не так: пропадет соединение с БД, другой пользователь изменит данные системы и т. п. Если ошибка возникла после нажатия на терминальные кнопки и не связана со значениями в полях, то такая ошибка показывается алертом над формой и страница прокручивается до него.
-Такой алерт пропадает при повторной отправке или если ошибка исправлена. В остальных случаях он висит и не скрывается, давая пользователю информацию, что было не так.
+Такой алерт «висит» и не скрывается, давая пользователю понять, что было не так, — и пропадает при повторной отправке формы.
- При повторной отправке формы все поля проверяются ещё раз. За время, пока пользователь дозаполнял форму, уникальность названия, например, могла пропасть.
+ При повторной отправке формы все поля проверяются еще раз. За время, пока пользователь дозаполнял форму, уникальность названия, например, могла пропасть.
##### Ошибки в полях
-Если не удалось сделать валидацию в полях во время ввода или по уходу с поля, то после отправки формы, страница прокручивается до первого поля с ошибкой и поле получает фокус.
+Если не удалось провести валидацию в полях во время ввода или по уходу с поля, то после отправки формы страница прокручивается до первого поля с ошибкой и оно получает фокус.
- Не блокируйте терминальную кнопку после отправки формы
+ Не блокируйте терминальные кнопки после отправки формы!
### Обязательные поля
-По умолчанию подразумевается, что все поля обязательные, обязательность никак не помечается. А необязательные как раз подписываются (или в плейсхолдере, или в подписи под полем).
+Если большинство полей на форме — обязательные для заполнения, то эту обязательность не нужно помечать. Необязательные поля, наоборот, подписываются (или в плейсхолдере, или в подписи под полем).
- Поля «комментарий», «описание» почти всегда необязательные, воспринимаются таковыми. Их можно не подписывать как необязательные.
+ Поля «Комментарий», «Описание» почти всегда необязательные и воспринимаются как необязательные. Их можно не подписывать.
-Состояние ошибки незаполненное обязательное поле получает только после отправки формы, в тексте ошибки сообщается (1), по каким причинам поле обязательно.
-
-*(1) Иногда текстом ошибки можно пренебречь, если из контекста формы понятно, что поле обязательно для заполнение или текст ошибки получается очень длинным.*
-
-Пустые обязательные поля не получают состояние ошибки при потере фокуса.
-
-
-
-
-
- Чтобы избежать проверки на незаполненность полей, можно использовать контролы с предустановленными значениями, которые нельзя оставить незаполненными (раскрывающийся список, радиокнопки)
-
-
- В больших формах не рекомендуется блокировать терминальные кнопки, может быть неочевидно, почему кнопка отправки формы неактивна.
+ На больших формах не рекомендуется блокировать терминальные кнопки, потому что может быть совсем неочевидно, почему кнопка неактивна.
#### Другие случаи
-Бывают случаи, когда нужно заполнить хотя бы одно из обязательных полей. В этом случае после отправки формы, обязательные поля не получают состояние ошибки, но выводится алерт.
-
-Текст алерта для каждого случая будет свой.
+Бывают случаи, когда нужно заполнить хотя бы одно из обязательных полей. В этом случае после отправки формы обязательные поля не получают состояние ошибки, но выводится алерт.
### Показ сообщений об ошибках вне форм
-Иногда требуется показывать ошибки вне форм, например было запущено сканирование, но в процессе сервер вернул ошибку, в таком случае показывайте уведомление в центре уведомлений.
+Иногда требуется показывать ошибки вне форм, например если было запущено сканирование, но в процессе сервер вернул ошибку. В таких случаях лучше показывать уведомление в центре уведомлений.