Сообщения об ошибках HTML5

Question

В моем приложении у меня есть несколько вкладок. В вкладках у меня есть поля ввода, и я хочу проверить эти поля на стороне клиента. Для этого я пытаюсь использовать атрибуты HTML5, например, атрибут required или pattern. В случае, когда у меня есть пустое поле (поле обязательное) на первой вкладке, которое выбрано, появляется сообщение об ошибке The field is required, но когда у меня есть пустое поле на другой вкладке, например, на третьей вкладке, и моя первая вкладка выбрана, сообщение об ошибке не появляется.

Вопрос Есть ли способ организовать проверку с помощью HTML5 в этой ситуации?

Answer 1

Вы скрываете элементы формы с display: none? Если элементы не видны они will not trigger the validation UI:

Доклад проблема с ограничениями по меньшей мере, одного из элементов, приведенных в необработанном недействительном управлении для пользователя. Пользовательские агенты могут сфокусировать один из этих элементов в процессе, выполнив шаги фокусировки для этого элемента и могут изменить положение прокрутки документа или выполнить другое действие, которое приносит элемент к вниманию пользователя. Пользовательские агенты могут сообщать о более чем одном нарушении . Пользовательские агенты могут объединять связанное ограничение отчетов о нарушениях, если это необходимо (например, если несколько радиокнопок в группе отмечены как необходимо, необходимо сообщить только одну ошибку). Если один элемент управления не отображается (например, он имеет скрытый набор атрибутов ), то пользовательские агенты могут сообщать об ошибке сценария.

В этой ситуации вам придется слушать invalid события со своим собственным сценарием и выполнить соответствующие действия.