Глава 7. Клиентский JavaScript Формы в html

Пользователь может прийти на сайт, чтобы читать статьи, смотреть видео или слушать музыку. Но наступает момент, когда пользователю необходимо отправить информацию на сервер, например, оставить комментарий. Специально для таких случаев в HTML есть набор элементов, из которых составляют формы. В них и вводятся данные. Поэтому прежде чем двигаться дальше, необходимо познакомиться и с этой областью HTML.

Чтобы сразу увидеть число элментов форм, можно взглянуть на табл. 7.1.

Таблица 7.1. Элементы форм

Назначение	Элемент HTML
Форма	form
Текстовое поле	input type=”text”
Поле для ввода пароля	input type=”password”
Флажок	input type=”checkbox”
Переключатель	input type=”radio”
Поле выбора файла	input type=”file”
Скрытое поле	input type=”hidden”
Простая кнопка	input type=”button”, input type=”submit”, input type=”reset”
Кнопка-изображение	input type=”image”
Продвинутая кнопка	button
Список выбора	select
Группа элементов списка	optgroup
Пункт списка	option
Многострочное поле	textarea
Надпись	label
Рамка	fieldset
Подпись для рамки	legend

Элемент form — собственно форма

Данный элемент предназначен для обозначения формы. Все элементы, относящиеся к одной форме, должны быть потомками одного и того же элемента form. Каждый элемент, помещенный в форму, обрабатывается браузером автоматически. Форма специально для этого и была разработана.

Элемент form является блочным и разрешает включать в него любые блочные элементы кроме других форм. Обратите внимание, что все элементы формы кроме fieldset не являются блочными, поэтому не могут быть непосредственно вложены в форму (их нужно заключать в какой-нибудь блок). Однако браузеру на данный момент обрабатываю неправильно включенные элементы.

У формы есть три специальных атрибута.

• action — URI, на который будет отправлено содержимое формы. Обязательный.

• method — метод отправки формы. Доступны два варианта:

  • get — отправка через URI. Применяется по умолчанию. При таком методе содержимое формы можно увидеть в адресной строке браузера.

  • post — отправка через http-заголовки. Этот метод позволяет передавать больший объем данных и не отображает содержание формы в адресной строке. Если через форму нужно передавать файл, то должно быть выставлено это значение.

• enctype — формат представления запроса. Есть два формата:

  • application/x-www-form-urlencoded — обычный формат кодирования, который применяется по умолчанию.

  • multipart/form-data — формат кодирования, применяемы для передачи больших объемов сложных данных. Должен быть указан для передачи файлов через форму.