Блог

Главная - Вопросы по программированию - Как заставить браузеры выборочно игнорировать обязательный атрибут HTML5 в формах

Как заставить браузеры выборочно игнорировать обязательный атрибут HTML5 в формах

#forms #html #required

#формы #HTML #требуется

Вопрос:

У меня есть стандартная HTML-форма, которая разделена на две части с использованием элементов fieldset. Один раздел предназначен для ввода имени, адреса электронной почты и т.д., А второй раздел предназначен для ввода почтового индекса для функции автозаполнения адреса (поле поиска почтового индекса во втором разделе не имеет обязательного атрибута).

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

Мой вопрос заключается в том, что когда пользователь вводит свой почтовый индекс в поле поиска почтового индекса, ничего не вводя в первом разделе, все поля в форме отправляются в браузерах, которые не поддерживают этот атрибут (например, Firefox 3.6). В Firefox 4 (например) он учитывает требуемый атрибут и предотвращает отправку формы, если есть пустые поля с обязательным атрибутом. Однако это нарушает мою реализацию проверки ошибок и валидации формы (на стороне сервера, в PHP).

Итак, есть ли способ указать браузеру (в данном случае) игнорировать «обязательные» атрибуты первого раздела при нажатии кнопки отправки второго раздела?

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

Кроме того, любое решение должно быть способно работать без JavaScript. Пожалуйста, не упоминайте никаких ответов, выступающих за замену раздела поиска почтового индекса Ajax, для меня было решено, что это недопустимый вариант.

Ответ №1:

Думаю, я понимаю вашу проблему. Я не верю, что в HTML есть что-то, что позволяет вам указать это более сложное правило проверки. Я думаю, вам придется либо:

  1. Разделите эти наборы полей на две отдельные формы на странице;

  2. Используйте две отдельные формы на двух разных страницах; или

  3. Перепишите свой серверный код так, чтобы поля формы, не связанные с почтовым индексом, включали required атрибут только тогда, когда пользователь отправил почтовый индекс.

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

1. 1. Я избежал этого, потому что, если пользователь отправит форму почтового индекса после ввода своих данных в отдельную форму «Личные данные», эти данные будут потеряны (не опубликованы и не зафиксированы иным образом), что было бы очень раздражающим для пользователя.

2. 2. Я думаю, что это, вероятно, «лучшее» решение без js.

3. 3. Не уверен, как это будет работать — вы предлагаете добавлять обязательный атрибут только после отправки формы почтового индекса? Это хорошая идея, но как это будет работать без использования JavaScript для перезаписи DOM?

4. @sfrost2004: Я согласен с вами в вопросе 1. Что касается 3., идея заключается в том, что когда сервер изначально предоставляет форму пользователю, он не включает required атрибуты ни в одно поле, кроме поля почтового индекса. Если пользователь отправляет форму, в которой заполнено только поле почтового индекса, сервер возвращает пользователю ту же форму с указанием адреса, но на этот раз он добавляет required атрибут к полям без адреса.

Ответ №2:

Есть ли какая-либо вложенная форма на вашей странице?. первый тег формы не работает во вложенных формах, как показано ниже. в этом случае используйте пустой тег формы, чтобы избежать ошибки. а также не пишите класс с тегом form, начинающимся как form.filed{}

 <form>
main form
<form> </form>
<form> form1 </form>
<form> form2 </form>

</form>