Форма HTML - это раздел документа, в котором содержатся обычная информация, разметка и специальные элементы, называемые управляющими элементам (флажки, кнопки с зависимой фиксацией, меню и т.д.), а также метки этих управляющих элементов. Обычно пользователи «заполняют» форму, модифицируя управляющие элементы (вводя текст, выбирая пункты меню и т.д.) перед тем, как предоставить форму агенту пользователя для обработки (например, на Web-сервер, на почтовый сервер и т.д.)

Пользователи взаимодействуют с формами с помощью именованных управляющих элементов.

«Имя элемента» задается атрибутом name. Областью действия атрибута name для управляющего элемента в элементе FORM является элемент FORM.

Каждый управляющий элемент имеет начальное и текущее значение, оба они являются символьными строками. Информацию о начальных значениях и возможных ограничениях на значения. В общем случае «исходное значение» управляющего элемента может задаваться с помощью атрибута value. Однако исходное значение элемента TEXTAREA задается его содержимым, а исходное значение элемента OBJECT в форме определяется реализацией объекта (т.е. лежит вне области, рассматриваемой в данной спецификации).

«Текущее значение» управляющего элемента сначала устанавливается равным начальному значению. Затем текущее значение может изменяться пользователем или

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

Когда форма предоставляется для обработки, с формой пары управляющий элемент-текущее значение. Передаваемые пары имя/значение называются.

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

кнопки

Авторы могут создавать три типа кнопок:

· кнопки отправки: При активизации такой кнопки производится. В форме может быть несколько кнопок отправки.

· кнопки сброса: При активизации такой кнопки для всех управляющих элементов устанавливаются

· прочие кнопки: Для таких кнопок действие по умолчанию не определено. С атрибутами каждой такой кнопки могут быть связаны. Если происходит событие (например, пользователь нажимает кнопку, отпускает ее и т.д.), включается связанный с событием скрипт.

Авторы должны определять язык скрипта для кнопок в (в элементе META).

Авторы создают кнопки с помощью элемента BUTTON или INPUT. Подробнее об определении различных типов кнопок.

флажки

Флажки (и кнопки с зависимой фиксацией) - это переключатели вкл./выкл., которые могут переключаться пользователем. Переключатель «включен», если для управляющего элемента установлен атрибут selected.

При отправке формы могут стать только включенные переключатели. Несколько флажков в форме могут иметь одно и то же Таким образом, например, флажки позволяют пользователям выбрать несколько значений для одного и того же свойства. Для создания флажков используется элемент INPUT.

кнопки с зависимой фиксацией

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

меню

Предоставляют пользователям варианты на выбор. Меню создается с помощью элемента SELECT, а также элементов OPTGROUP и OPTION.

текстовый ввод

Для ввода текста пользователем авторы могут создавать управляющие элементы двух типов. Элемент INPUT создает управляющий элемент для ввода текста из одной строки, а элемент TEXTAREA - элемент для ввода текста из нескольких строк. В обоих случаях вводимый текст становится управляющего элемента.

выбор файлов

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

скрытые управляющие элементы

Авторы могут создавать управляющие элементы, не представляемые пользователям, но имеющие значения, которые передаются с формой. Обычно они используются для хранения информации между обменом клиент / сервер, которая в противном случае могла бы пропасть вследствие stateless природы протокола HTTP (см.). Для создания скрытого управляющего элемента используется элемент INPUT.

объекты

Авторы могут помещать в формы общие объекты, так что связанные с ними значения будут передаваться с другими управляющими элементами. Для создания таких управляющих элементов используется элемент OBJECT.

Элементы, используемые для создания управляющих элементов, обычно располагаются в элементе FORM, но могут находиться и за пределами объявления FORM, если они используются для построения интерфейса пользователя. Это обсуждается в разделе о Обратите внимание, что управляющие элементы за пределами формы не могут быть.

Начальный тег: обязателен, Конечный тег: обязателен

Определения атрибутов

action = uri

Задает агента для обработки формы. Например, значением может быть URI HTTP (для передачи формы в программу) или mailto URI (для отправки формы по электронной почте).

method = get|post

Определяет метод HTTP, используемый для передачи. Возможные значения (с учетом регистра) - «get» (по умолчанию) и «post».

enctype = content-type

Этот атрибут задает, используемый для отправки формы на сервер (если для метода используется значение «post»). По умолчанию для этого атрибута используется значение «application/x-www-form-urlencoded». С элементом INPUT, type= «file» должно использоваться значение «multipart/form-data».

accept-charset = список наборов символов

Этот атрибут задает список для ввода данных, которые должны приниматься обрабатывающим эту форму сервером. Значением является разделенный пробелами и / или запятыми список значений. Сервер должен интерпретировать этот список как список исключающих или, то есть он должен принимать любую кодировку для загруженного объекта.

По умолчанию значением этого атрибута является зарезервированная строка «UNKNOWN». Агенты пользователей могут интерпретировать это значение как кодировку символов, используемую для передачи документа, содержащего этот элемент FORM.

accept = content-type-list

Этот атрибут определяет разделенным запятыми список типов содержимого, которые должен корректно обрабатывать сервер, обрабатывающий форму. Агенты пользователей могут использовать эту информацию для отфильтровывания отвечающих спецификации файлов при предложении пользователю выбора файлов для отправки на сервере (если в элементе INPUT указано type= «file»).

Атрибуты, определяемые в другом месте

· title ()

· target ()

Элемент FORM служит контейнеров для. Он определяет:

· Макет формы (дается содержимым элемента).

· Программу, которая будет обрабатывать заполненную и переданную форму (атрибут action). Получающая форму программа должна иметь возможность определения пар имя/значение, чтобы их использовать.

· Метод отправки данных на сервер (атрибут method).

· Кодировку символов, которая должна приниматься сервером для обработки этой формы (атрибут accept-charset). Агенты пользователей могут рекомендовать пользователю значение атрибута accept-charset и / или не позволять пользователям вводить нераспознаваемые символы.

Форма помимо может содержать текст и разметку (абзацы, списки и т.д.).

В следующем примере показана форма, которая должна обрабатываться программой «adduser». Эта форма будет отправляться с использованием метода HTTP «post».

<FORM action= «http://somesite.com/prog/adduser» method= «post»>

…содержимое формы…

</FORM>

В следующем примере показана отправка формы на адрес электронной почты:

<FORM action= «mailto: Kligor.T@gee.whiz.com» method= «post»>

…содержимое формы…

</FORM>

Информацию о том, как агенты пользователя должны подготавливать данные формы для серверов и как они должны обрабатывать ответы от сервера Вы можете найти в разделе об.

Начальный тег: обязателен, Конечный тег: запрещен

Определения атрибутов

type = text|password|checkbox|radio|submit|reset|file|hidden|image|button

Определяет. По умолчанию используется значение «text».

name = cdata

Определяет.

value = cdata

Определяет управляющего элемента. Этот атрибут не обязателен, если только для атрибута type не установлено значение «radio».

size = cdata

Сообщает агенту пользователя начальную ширину управляющего элемента. Ширина дается в, если для атрибута type не установлено значение «text» или «password». В этом случае ширина задается в числе символов (число должно быть целым).

maxlength = число

Если для атрибута type установлено значение «text» или «password», этот атрибут определяет максимальное число символов, вводимых пользователем. Это число может превышать указанный в атрибуте size размер поля; в этом случае агент пользователя должен обеспечивать механизм прокрутки. По умолчанию число символов не ограничено.

checked

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

src = uri

Если атрибут type имеет значение «image», этот атрибут определяет местоположение изображения, используемое для представления графической кнопки.

Атрибуты, определяемые в другом месте

· title ()

· alt ()

· align ()

определяемый элементом INPUT, зависит от значения атрибута type:

text

Создает элемент из одной строки.

password

Аналогичен значению «text», но вводимый текст представляется таким образом, чтобы не отображать символы (например, в виде ряда звездочек). Этот управляющий элемент часто используется для ввода паролей. Обратите внимание, что является текст, введенный пользователем, а не текст, представляемый агентом пользователя.

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

checkbox Создает

radio Создает

submit Создает

image Создает графическую Значение атрибута src задает URI изображения, используемого для представления кнопки. Из соображений доступности авторам следует предусматривать для изображения с помощью атрибута alt.

Если для щелчка на изображении используется указующее устройство, на сервер передаются форма и координаты щелчка. Значение x измеряется в от левой границы изображения, а значение y - в от верхней границы изображения. В передаваемые данные включаются последовательности имя.x=значение-x и name.y=значение-y, где «имя» - значение атрибута name, а значение-x и значение-y - значения координат x и y соответственно.

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

· Использовать несколько кнопок отправки (каждая с отдельным изображением) вместо одной графической кнопки. Можно использовать для управления местоположением этих кнопок таблицы стилей.

· Использовать и скрипты.

reset Создает кнопку сброса.

button Создает другую кнопку. Агенты пользователей должны использовать в качестве метки на кнопке значение атрибута value.

hidden Создает невидимый управляющий элемент.

file Создает управляющий элемент выбор файла. Агенты пользователей могут использовать значение атрибута value в качестве исходного имени файла.

В следующем фрагменте кода HTML определяется простая форма, позволяющая пользователям вводить имя, фамилию, адрес электронной почты и пол. В случае активизации кнопки отправки форма передается программе, указанной в атрибуте action.

<FORM action= «http://somesite.com/prog/adduser» method= «post»>

<P>

Имя: <INPUT type= «text» name= «firstname»><BR>

Фамилия: <INPUT type= «text» name= «lastname»><BR>

email: <INPUT type= «text» name= «email»><BR>

<INPUT type= «radio» name= «sex» value= «Male»> Мужской<BR>

<INPUT type= «radio» name= «sex» value= «Female»> Женский<BR>

<INPUT type= «submit» value= «Отправить»> <INPUT type= «reset»>

</P>

</FORM>

В следующем примере показано, как содержимое указанного пользователем файла - может передаваться вместе с формой. У пользователя запрашивается имя и список имен файлов, содержимое которых должно передаваться с формой. С помощью указания значение enctype для «multipart/form-data» содержимое всех файлов будет упаковываться для передачи в отдельные разделы существующего документа.

<FORM action= «http://server.dom/cgi/handle»

enctype= «multipart/form-data»

method= «post»>

<P>

Как Вас зовут? <INPUT type= «text» name= «name_of_sender»>

Какие файлы Вы отправляете? <INPUT type= «file» name= «name_of_files»>

</P>

</FORM>

Начальный тег: обязателен, Конечный тег: обязателен

Определения атрибутов

name = cdata

Определяет

value = cdata

Определяет кнопки.

type = submit|button|reset

Объявляет тип кнопки. Возможные значения:

· submit: Создает Это значение используется по умолчанию.

· reset: Создает

· button: Создает

Кнопки, создаваемые с помощью элемента BUTTON, действуют так же, как и кнопки, создаваемые с помощью элемента INPUT, но они обеспечивают более богатые возможности представления: элемент BUTTON может иметь содержимое. Например, элемент BUTTON, содержащий изображение, действует и может resemble подобно элементу INPUT, для атрибута type которого установлено значение «image», но тип элемента BUTTON может иметь содержимое content.

Визуальные агенты пользователей могут представлять кнопки BUTTON рельефно или с эффектом нажатия при щелчке мыши, в то время как кнопки INPUT могут представляться только как «плоские» изображения.

В следующем примере предыдущий пример расширяется, и кнопки и создаются с помощью элемента BUTTON вместо элемента INPUT. Используемое для кнопок изображение определяется элементом IMG.

<FORM action= «http://somesite.com/prog/adduser» method= «post»>

<P>

Имя: <INPUT type= «text» name= «firstname»><BR>

Фамилия: <INPUT type= «text» name= «lastname»><BR>

email: <INPUT type= «text» name= «email»><BR>

<INPUT type= «radio» name= «sex» value= «Male»> Мужской<BR>

<INPUT type= «radio» name= «sex» value= «Female»> Женский<BR>

<BUTTON name= «submit» value= «Отправить» type= «submit»>

Send<IMG src=»/icons/wow.gif» alt= «Ого»></BUTTON>

<BUTTON name= «reset» type= «reset»>

Reset<IMG src=»/icons/oops.gif» alt= «ой»></BUTTON>

</P>

</FORM>

Помните, что авторам следует предусматривать для элемента IMG.

Не допускается связывать изображение-карту с элементом IMG, содержащимя в элементе BUTTON element.

Начальный тег: обязателен, Конечный тег: обязателен

Определения атрибутов элемента SELECT

name = cdata

Определяет

size = number

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

multiple

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

Элемент SELECT создает. Каждый вариант пункт меню представляется элементом OPTION. Элемент SELECT должен содержать хотя бы один элемент OPTION.

Элемент OPTGROUP element позволяет авторам логически группировать варианты. Обычно это полезно, если пользователь должен делать выбор в длинном списке вариантов; группы связанных вариантов проще просматривать и запоминать, чем один длинный список вариантов. В HTML 4.0 все элементы OPTGROUP должны задаваться непосредственно в элементе SELECT (т.е. группы не могут быть вложенными).

Литература

1. Матросов А.В., Сергеев А.О., Чаунин М.П. HTML 4.0 - СПб.: БХВ - Петербург, 2007. - 672 с.

2. Финков М.В. Интернет. Шаг второй: от пользователя к профессионалу - Спб.: Наука и Техника, 2002. - 768 с.

3. Левин А.Ш. Самоучитель работы на компьютере. 8-е изд. - СПб.: Питер, 2005. - 655 с.

4. Леонтьев В.П. Новейшая энциклопедия персонального компьютера 2004 - М.: Олма-Пресс, 2004.

5. Никамин В.А. Цифровая звукозапись: технологии и стандарты - СПб.: Наука и Техника, 2002.

6. Спецификация HTML 4.0