Элемент form

Модуль Basic Forms

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

В состав модуля Basic Forms входят основные элементы HTML, связанные с обработкой форм: form, input, label, option, select и textarea.

Элемент form задает саму форму, а элемент label задает надписи к элементам формы, называемыми элементами управления.

Элемент input позволяет задавать такие элементы управления как текстовые поля (в том числе текстовые поля, обеспечивающие ввод паролей), кнопки, переключатели и радиокнопки. Элементы select и option задают раскрывающиеся меню, а элемент textarea – текстовые области. Элемент можно использовать для задания сопроводительных надписей к графическим элементам.

В документе HTML для задания формы используется контейнер <form>...</form>. Документ может со­держать несколько форм, но они не могут быть вложены одна в другую.

Помимо общих атрибутов class, dir, id, lang, style и title, для элемента form можно задавать следующие атрибуты:

· accept – список разделённых запятыми типов содержимого, которые сервер-обработчик формы будет обрабатывать корректно;

· accept-charset – список кодировок для вводимых данных, принимаемых сервером, обрабатывающим данную форму;

· action – адрес ресурса, содержащего обработчик формы;

· enctype – метод кодирования данных, отправляемых формой, в виде MIME-типа (по умолчанию для кодирования данных предполагается метод MIME-типа application/x-www-form-urlencoded);

· method – метод HTTP, используемый для отправки данных формы (по умолчанию предполагается метод get);

· name – имя формы;

· target – имя фрейма, в который будут выводиться результаты обработки формы.

Значением атрибута action является URL-адрес программы, которая будет обрабатывать инфор­мацию, извлеченную из данной формы. В значении атрибута могут быть также заданы параметры вызова программы, например:

action="https://localhost/hello.asp?login=ivanov&pass=stud1"

Атрибут method определяет метод пересылки данных, содержащихся в форме, от Web-браузера к Web-серверу. Он может принимать два значения: get (по умолчанию) и post.

Значением атрибута enctype является MIME-тип, определяющий формат кодирования данных при передаче их от Web-браузера к серверу (Web-браузер кодирует данные, чтобы исключить их искажение в процессе передачи).

Для пересылки форм используются два метода кодирования информации, содержащейся в форме:

· стандартный метод application/x-www-form-urlencoded, используемый по умолчанию;

· дополнительный multipart/form-data.

Второй метод нужен только в том случае, если к содержимому формы присоединяется локальный файл, выбранный при помощи элемента формы <input type="file">. В остальных случаях следует использовать метод коди­рования по умолчанию.

Атрибуты accept и accept-charset задают списки соответственно MIME-типов и кодировок данных, которые должен воспринимать Web-сервер, чтобы обработать данные формы.

Если обработка данных формы производится в Web-браузере (с помощью сценария), параметры action, method, enctype, accept и accept-charset задавать не надо (использование этих параметров будет рассмотрено при изучении средств обработки данных на Web-сервере).

Атрибут name обычно используется в Web-страницах для доступа к форме и ее элементам.

Атрибут target позволяет вывести результаты обработки формы в другой фрейм (по умолчанию результаты обработки выводятся в тот же фрейм, в котором находится форма).

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

· action – значение атрибута action;

· method – значение атрибута method;

· enctype – значение атрибута enctype;

· name – значение атрибута name;

· acceptCharset – значение атрибута accept-charset;

· target – имя фрейма, в который будет выводиться форма;

· length – количество элементов управления в форме;

· elements (только для чтения) – содержит объект HTMLCollection с элементами управления формы.

Кроме того, для элемента определены два метода: reset() и submit(). Первый метод имитирует нажатие кнопки сброса данных (типа reset), второй – нажатие кнопки передачи данных на Web-сервер (типа submit) (см. 4.5.5.3.6).

Пример 4.5.21. Задание элемента form:

1. <form action="NewUser.php">

…

</form>.

Пересылка данных формы на Web-сервер с использованием метода передачи get (по умолчанию) и метода кодирования данных application/x-www-form-urlencoded (по умолчанию). На Web-сервере для обработки данных формы и формирования ответа в виде документа HTML будет запущена программа NewUser.php.

2. <form action="FileUpload.asp" method="post"

enctype="multipart/form-data">

…

</form>.

Пересылка данных формы на Web-сервер с использованием метода передачи post и метода кодирования данных multipart/form-data. На Web-сервере для обработки данных формы и формирования ответа в виде документа HTML будет запущена программа FileUpload.asp.

3. <form id="localForm1">

…

</form>.

Данные в форме будут обрабатываться в Web-браузере с использованием сценариев.