Форма (HTML)

Материал из Википедии — свободной энциклопедии
Перейти к: навигация, поиск

Форма (англ. form) в HTML — раздел документа, позволяющий пользователю вводить информацию для последующей обработки системой. Синтаксически форма в HTML задаётся с помощью элемента form и в дополнение к разметке обычных элементов содержит разметку для элементов управления (англ. controls), надписей (англ. label) и других[1][2].

Пример[править | править исходный текст]

Простая форма для ввода данных о новом пользователе[1]:

<form action="http://example.com/app/profile" method="post">
 <p>
   <label for="username">Имя: </label>
   <input type="text" id="username" /><br />
   <label for="nick">Ник: </label>
   <input type="text" id="nick" /><br />
   <label for="email">Адрес эл. почты: </label>
   <input type="text" id="email" /><br />
   <label for="sex">Пол: </label>
   <input type="radio" name="sex" value="male">мужской<br />
   <input type="radio" name="sex" value="female">женский<br />
   <input type="submit" value="Отправить"> <input type="reset" value="Отменить">
 </p>
</form>

В этом примере форма содержит три текстовых поля для ввода текстовой строки, радиокнопки для выбора пола, кнопки для отправки (англ. submit) и очистки (англ. reset) формы.

Элементы управления[править | править исходный текст]

Элементы управления служат для взаимодействия пользователя с формой. Атрибут name определяет имя элемента управления с областью видимости внутри данной формы.

С каждым элементом формы связано начальное и текущее значение. За некоторыми исключениями (textarea, object), начальное значение может быть задано атрибутом value. Значения, соответствующие элементам, могут изменяться при взаимодействии пользователя или скриптов (например, на Javascript) с формой. При очистке (англ. reset) формы элементы приобретают начальные значения. Данные всех действующих (англ. successful) элементов формы отправляются (англ. submit) на обработку в виде пар имя-значения[1][2].

Типы[править | править исходный текст]

В HTML определены следующие элементы управления:

  • кнопка: элемент input типов submit, image, reset, button, а также элемент button,
  • чекбокс (флажок): тип checkbox
  • радиокнопка: тип radio
  • меню: элемент select с элементами optgroup и option внутри
  • строка текста: тип text, а также элемент textarea
  • пароль: тип password
  • скрытое поле: тип hidden
  • файл: тип file
  • объект: элемент object

HTML5 определяет дополнительные элементы (кросс-браузерность пока отсутствует)[3]:

  • элемент datalist с вариантами автозаполнения строки текста,
  • элемент output для результа вычисления на основе других полей,
  • элемент keygen для генерации пары ключей для использования в механизме аутентификации.

Элемент form[править | править исходный текст]

Форма задаётся с помощью элемента form, внутри которого и располагаются элементы управления. Кроме общих для HTML атрибутов, в form могут присутствовать следующие[1][2]:

  • action (действие) — обязательный атрибут, содержащий URI обработчика формы;
  • method (метод отправки формы) — атрибут, принимающий значения GET (по умолчанию) или POST
  • enctype (тип кодирования для содержимого) — по умолчанию application/x-www-form-urlencoded (всегда для метода GET), но обычно употребляется multipart/form-data
  • accept — список MIME-типов для загрузки файлов
  • name — имя формы
  • onsubmit — обработчик события «форма отправлена»
  • onreset — обработчик события: «форма очищена»
  • accept-charset список поддерживаемых наборов символов

Отправка формы[править | править исходный текст]

Для отправки формы имеются два метода: get и post. Метод get рекомендуется использовать в случаях, когда при обработке формы на стороне сервера не происходит побочных действий, например, поиск. В противном случае, когда на стороне сервера подразумевается модификация в базах данных и т. п., требуется использовать метод post[1].

Примечания[править | править исходный текст]

  1. 1 2 3 4 5 Спецификация языка HTML, переводчик: А. Пирамидин, intuit.ru, ISBN 978-5-94774-648-8, 17. Лекция: Формы.
  2. 1 2 3 Forms in HTML documents (англ.) Спецификация W3C для HTML4
  3. HTML5 Form Elements, w3schools