Заметки о вёрстке сайтов  ·  Александр Шуркаев об HTML, CSS и JavaScript (скрипты, справочники и примеры по сайтостроению)

Атрибут required в HTML форме

9 марта 2007 г.

Полезный для валидации данных формы атрибут required. Не совместим со справочниками W3C.

Где-то в 2003 году я написал и стал использовать в разрабатываемых проектах простой js'ник для валидации форм. По событию submit формы он проверяет заполненость полей, помеченных придуманным атрибутом required (напр., <input type="text" name="email" required="true">). У меня проверяются поля типа textarea и text, можно добавить другие типы, кроме hidden, image, submit и некоторых других, не могущих в принципе проверяться на заполненность пользователем. Можно также добавить обрезание whitespace'а.

function fnCheckFields(form_obj){
    var error_msg = "Пожалуйста, заполните все обязательные поля.";
    var is_error = false;
    for (var i = 0; form_obj_elem = form_obj.elements[i]; i++)
        if (form_obj_elem.type == "textarea" || form_obj_elem.type == "text")
            if (form_obj_elem.getAttribute("required") && !form_obj_elem.value)
                is_error = true;

    if (is_error) alert(error_msg);
    return !is_error;
}

Пример:

Не так давно я узнал, что атрибут required обитает в Web Forms 2.0. Забавно.

А сегодня узнал и удостоверился в том, что спецификация Web Forms 2.0 поддерживается браузером Opera 9+, и моя js-валидация красиво работает с отключенным JavaScript'ом. Это даже при том, что по стандарту Web Forms 2.0 точнее писать required="required", а не required="true". Картинка:

Валидация поля с required в Opera 9

NB: На момент опубликования заметки атрибут required не совместим с W3C рекомендациями, если вас это заботит.

Хитовые статьи про разработку сайтов

Рассылка новостей и новых статей

Сообщения будут приходить пару раз в неделю, не чаще

Объявления

Надежная трубопроводная арматура Tyco, Keystone, Zetkama у нас
LiveInternet