Опубликован: 19.05.2006 | Уровень: для всех | Доступ: платный
Лекция 17:

Формы

Аннотация: В разделе дается описание форм, элементы управления и атрибуты элементов. Описываются механизмы работы с формами, передача фокуса элементам управления и обработка данных формы.
Ключевые слова: форма, элемент управления, radio-кнопка, меню, лэйбл, кнопка push, очистка формы, пользователь, значение, символьная строка, определение, textarea, объект, 'действующий' управляющий элемент, кнопка submit, кнопка reset, язык скриптов, пользовательский агент, RFC, списки значений, элемент выбора файла, скрытый элемент управления, внутреннее событие, HTTP, URI, GET, POST, набор данных формы, ПО, тип содержимого, сервер, application/x-www-form-urlencoded, multipart/form-data, acceptable, список, символ, XOR, CDATA, атрибут, обратная совместимость, целевой фрэйм, ondblclick, контейнер, Дополнение, adduser, checkbox, radio, integer, целое число, булев атрибут, место, альтернативный текст, элемент 'только для чтения', карта изображений, onchange, доступность, verifiability, установка значений, опция, HTML, ошибка, latin-1, IDREF, элемент управления text, фокус, навигация с помощью табуляции, legend, медиана, информация, представление, порядок табуляции, недоступный элемент управления, автор, поиск в базе данных, declare, invisible, escape-последовательности, S/MIME, octet, MIX, файлы заголовки

Введение

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

Пользователи обычно "заполняют" форму, изменяя содержимое её элементов (вводя текст, выбирая пункты меню и т.д.), прежде чем отправить её агенту для обработки (напр., Web-серверу, mail-серверу и т.п.)

Вот пример простой формы, включающей лэйблы, radio-кнопки и кнопки push (для очистки или отправки формы ):

<FORM action="http://somesite.com/prog/adduser" method="post">
   <P>
   <LABEL for="firstname">First name: </LABEL>
             <INPUT type="text" id="firstname"><BR>
   <LABEL for="lastname">Last name: </LABEL>
             <INPUT type="text" id="lastname"><BR>
   <LABEL for="email">email: </LABEL>
             <INPUT type="text" id="email"><BR>
   <INPUT type="radio" name="sex" value="Male"> Male<BR>
   <INPUT type="radio" name="sex" value="Female"> Female<BR>
   <INPUT type="submit" value="Send"> <INPUT type="reset">
   </P>
</FORM>
Примечание. Эта спецификация содержит более развёрнутую информацию о формах в разделе "Приложение B: Замечания относительно Исполнения, Разработки и Дизайна" .

Элементы управления

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

Имя элемента управления (ЭУ), "control name", задаётся атрибутом name. Областью видимости атрибута name ЭУ внутри формы является элемент FORM.

Каждый ЭУ имеет начальное и текущее значение типа "символьная строка". См. определение каждого ЭУ для спецификации начальных значений и возможные ограничения значений, принимаемых ЭУ. В целом, "начальное значение\initial value" может быть установлено атрибутом value ЭУ. Однако начальное значение ЭУ TEXTAREA задаётся его содержимым, а начальное значение ЭУ OBJECT в форме определяется реализацией данного объекта (т.е. находится вне пределов данной спецификации).

"Текущее значение\current value" ЭУ вначале устанавливается в первоначальное значение. После этого текущее значение ЭУ можно изменять, взаимодействуя с пользователем, и с помощью "Сценарии (скрипты)" .

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

Если ЭУ не имеет начального значения, воздействие очистки формы на данный ЭУ не определено.

При отправке формы на обработку, некоторые ЭУ образуют пары "имя/значение", которые затем пересылаются с формой. ЭУ, чьи пары имя/значение высланы, называются "действующие ЭУ" .

Типы элементов управления формы (ЭУ)

HTML определяет следующие типы ЭУ:

кнопки

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

  • кнопки submit: при активации кнопка submit отправляет форму. Форма может содержать несколько кнопок submit ;
  • кнопки reset: при активации кнопка reset устанавливает все ЭУ в их начальные значения;
  • кнопки push: кнопки push не имеют предопределённых функций. Каждая кнопка push может иметь "Сценарии (скрипты)" , ассоциированный с атрибутом event/событие. При возникновении события (напр., пользователь нажал кнопку, отпустил её и т.д.), включается ассоциированный сценарий (скрипт).

Автор должен указать язык сценария кнопки push путём объявления языка скриптов по умолчанию (в элементе META ).

Авторы создают кнопки, используя ЭУ BUTTON, или ЭУ INPUT. См. определение этих ЭУ.

Примечание. Авторы должны иметь в виду, что возможности ЭУ BUTTON богаче, чем у INPUT.

переключатели/checkboxes

Переключатели (и radio-кнопки ) это переключатели типа вкл./выкл., управляемые пользователем. Переключатель "включён", если установлен атрибут checked ЭУ. Если форма отправлена, только переключатель "включён" может быть "действующим".

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

radio-кнопки

Radio-кнопки похожи на переключатели/checkboxes, за исключением того, что, при использовании одного и того же имени ЭУ, они действуют взаимоисключающе: если одна выбрана "включено", все остальные с тем же именем "выключены". Элемент INPUT используется для создания ЭУ " radio-кнопка ".

Если ни одна radio-кнопка из использующих общее имя первоначально не установлена во "включено", поведение пользовательского агента (ПА) по установлению того, какая из кнопок включена, не определено.

Примечание. Поскольку существующие приложения обрабатывают эту ситуацию по-разному, данная спецификация отличается от RFC 1866 ( "Индекс элементов" раздел 8.1.2.4) в следующем:

В определённый момент времени только одна radio-кнопка из набора может быть "включена". Если ни один из элементов <INPUT> набора radio-кнопок не установлен ( 'CHECKED' ), тогда ПА обязан вначале включить первую из кнопок набора.

Поскольку поведение ПА различно, авторы должны убедиться, что в каждом наборе radio-кнопок одна "включена".

меню

Меню дают возможность выбора из списка значений. Элемент SELECT создаёт меню в комбинации с элементами OPTGROUP и OPTION.

текстовые поля

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

выбор файла/file select

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

hidden control/скрытый ЭУ

Авторы могут создавать невидимые ЭУ, значения которых пересылаются вместе с формой. Обычно ЭУ этого типа используются для хранения информации при обмене клиент/сервер, которая иначе может быть утеряна из-за нестатичной природы HTTP (см. "Индекс элементов" ). Элемент INPUT используется для создания скрытых ЭУ/hidden control.

ЭУ object

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

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

Ирина Кириллова
Ирина Кириллова

Нажимаю на ссылку на дополнительный материал и дополнение к информации-меня возвращает на первую страницу лекции. Подскажите, что делать? Или дополнительный материал платный?

Евгений Летенков
Евгений Летенков
Россия, Москва, РУДН, 2005
Иван Бокарёв
Иван Бокарёв
Австрия