Решение проблемы с проверкой данных формы в FireFox4

[Aleksty]

Решение проблемы с проверкой данных формы в FireFox4

Буквально вчера наткнулся на такую засаду:

Имеется форма, валидация данных в которой происходит через яваскрипт.

В данном случае сбой произошел при применении атрибута required.

На скринах видно, что должно было быть, и есть(!), в версиях до 4-й, и что стало в 4-й -

1. Версия 3.3.16 - При ошибке, при заполнении формы, выскакивает сообщение и поля формы, в которых сделаны ошибки, заливаются фоном, вот так:

2. Версия 4 - Мало того, что вокруг полей появляется красная рамка, так и еще и невозможно ввести данные, тут же выдает сообщения, так примерно:

Решение нашел, помогли добрые люди, цитирую: "Это проверка на стороне клиента с помощью HTML5".

То есть у меня, похоже, проверка лисы "приговорила" мой скрипт! Мало того, в лисе использован именно этот атрибут - required, это скорее всего и стало причиной активации проверок формы лисой.

Кстати, такая же история наблюдалась и в Google Chrome!!!

Из спецификации:

The simplest annotation is the required attribute, which can be specified on input elements to indicate that the form is not to be submitted until a value is given. By adding this attribute to the customer name and delivery time fields, we allow the user agent to notify the user when the user submits the form without filling in those fields: дальше код....

Менять свой скрипт не хотелось, очень удобный.

Решение проблемы оказалось проще простого -

можно отключить валидацию данных через атрибут novalidate у тега <form>!

<form атрибуты="формы" novalidate></form>

Может кто столкнулся с такой же проблемой!

Решение перед вами.

[Быколай]

что-то невкурил в чём проблема вашего скрипта... после чудной статьи "сумасшедшие формы" тоже на проекте понаворотил все возможные ультрасовременные фичи

но проверка jQuery осталась и всё работает нормально. вводить нормально даёт новый атрибут, а проверяет только при попытке отправки. а смысл прописывать required и ставить novalidate? чего-то не догоняю...

[Aleksty]

Да нет проблем у скрипта, работает замечательно.

Мне кажется все дело в совпадении имен атрибутов.

Вот как пишем в форме:

<strong><b class="uni">в</b>аше имя:</strong><br>
<input class="fm1" name="name" type="text" value="" size="30" maxlength="32" required><br><br>
<strong><b class="uni">в</b>аш email:</strong><br>
<input class="fm1" name="email" type="text" value="" size="40" maxlength="52" pattern="^\s*\w+@\w+\.\w+\s*"><br><br>

Все поля с атрибутом required и подвергаются проверки лисой.

Так где атрибут pattern, все в порядке.

[Быколай]

ух ты, а про pattern я не знал, надо будет пофиксить

так да, проверяется все required, только в момент отправки, я не понял как это мешает заполнить поля, с таким не сталкивался вроде.

несколько не в тему, но есть чудесное css-свойство :first-letter, поддерживается, насколько знаю, всеми браузерами.

это я к еретическому <b class="uni">в</b>

Edited April 10, 2011 by Быколай

[Aleksty]

ух ты, а про pattern я не знал, надо будет пофиксить

так да, проверяется все required, только в момент отправки, я не понял как это мешает заполнить поля, с таким не сталкивался вроде.

несколько не в тему, но есть чудесное css-свойство :first-letter, поддерживается, насколько знаю, всеми браузерами.

это я к еретическому <b class="uni">в</b>

Спасибо. Это мне известно, сейчас, а когда верстался первый вариант сайта (более 60 страниц), то я не знал, не только этого, но практически ничего не знал.

Когда переделывал, то от избытка инфы, просто лень было все переписывать, работает и ладно....

Там и сейчас ляпов столько, что легче новый сверстать, чем этот переделать, что и забито в планы.

Edited April 10, 2011 by Aleksty