top of page
FORM
 

(HTML 2.0) - Form

Используется для создания заполяемой формы. Необходимо присутствие начального и конечного тегов. Внутри элемента FORM разрешается использовать большинство HTML-элементов.

Атрибуты:

NAME - определяет имя формы, уникальное для данного документа. Используется, если в документе присутствует несколько форм.

ACTION - обязательный атрибут. Определяет URL, по которому будет отправлено содержимое формы - путь к скрипту сервера, обслуживающему данную форму.

METHOD - определяет способ отправки содержимого формы. Возможные значения GET (по умолчанию) и POST.

ENCTYPE - определяет способ кодирования содержимого формы при отправке. По умолчанию используется "application/x-www-form-urlencoded".

TARGET - определяет имя окна, в которое возвращается результат обработки отправленной формы. Возможные значения :_self, _parent, _top,_blank или явно указанное имя окна.

Подробное описание значений смотрите в атрибуте TARGET элемента A.

Пример :

 

<!-- Создаем форму -->

<FORM ACTION="/cgi-bin/thanks.pl" METHOD=GET NAME="TestForm">

 

<!-- Внутри формы создаем поле ввода: -->

Фамилия:

<INPUT TYPE="text" name="lastname" SIZE="20" VALUE="Пупкин"><br>

 

<!-- Кнопка "Отправить": -->

<INPUT TYPE="submit" VALUE="Отправить"></FORM>

<!-- Все, конец форме -->'

Примечания:

  • Во время отладки скрипта, принимающего данные, удобнее всего использовать метод GET.

  • Метод GET не позволяет передать скрипту большой объём данных. Если предполагается, что пользователь будет заполнять очень большую форму или вводить объёмные текстовые данные, или пересылать файл - используйте METHOD="POST".

  • Перед тегом <FORM> в браузерах Netscape образуется пустое пространство, вертикальный отступ. Если вас это не устраивает и при этом форма на странице одна, поместите тег <FORM> в начало страницы, сразу после тега <BODY>, это должно помочь.

HTML-Учебник.Формы.
 
Формы.

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

Элементы для создания форм и работы с ними.

FORM - Создает заполяемую форму

TEXTAREA - Создает поле для ввода нескольких строк текста

SELECT - Создает меню в заполняемой форме

OPTION - Создает отдельные пункты в меню (см. SELECT)

INPUT - Создает поле в форме

FORM
TEXTAREA
 

(HTML 2.0) - Text Area

Создает поле для ввода нескольких строк текста. Обычно содержит текст инициализации, который при загрузке документа изначально будет записываться в данное поле. Элемент TEXTAREA должен располагаться внутри элемента FORM.

Атрибуты:

NAME - обязательный атрибут. Определяет название, которое будет использоваться при идентификации заполненого поля сервером.

ROWS - определяет количество строк текста, видимых на экране.

COLS - определяет ширину текстового поля - в печатных символах.

WRAP - определяет способ переноса слов в заполняемой данной заполняемой форме. Возможные значения:

  • off - перенос слов не происходит (значение по умолчанию)

  • virtual - перенос слов только отображается, на сервер же поступает неделимая строка.

  • physical - перенос слов будет происходить во всех точках переноса.

Пример :

 

...

<FORM ACTION="receive.html" METHOD=POST>

<TEXTAREA NAME="address" WRAP="virtual" COLS="40" ROWS="3">

Ваш адрес...

</TEXTAREA><br>

<INPUT TYPE="submit" VALUE="OK">

</FORM>

...

Примечания:

  • Поле типа TEXTAREA позволяет пользователю набрать довольно большой блок текста. Поэтому, если в форме присутствует поле TEXTAREA, передавайте скрипту данные методом POST (см. элемент FORM) иначе есть вероятность потери данных.

TEXTAREA
SELECT
 

(HTML 2.0) - Select

Элемент SELECT создает в заполняемой форме меню типа "Выбор одного пункта из многих" или "Выбор нескольких пунктов из многих". Должен располагаться внутри элемента FORM и иметь как начальный, так и конечный теги. Содержит несколько элементов OPTION, иначе не имеет смысла.

Атрибуты:

MULTIPLE - дает возможность выбора нескольких пунктов меню при удержании клавиши Ctrl. По умолчанию можно выбрать только один пункт меню.

NAME - определяет имя меню, уникальное для данной формы, которое будет использоватся при передаче данных на сервер. Каждый выбранный пункт меню при передаче на сервер будет иметь вид: name/value. Значение (value) формируется элементом OPTION.

SIZE - определяет количество видимых пунктов в меню. Если значение этого атрибута больше единицы, то результатом будет список пунктов.

Пример :

 

...

<FORM ACTION="receive.cgi">

<SELECT NAME="OS" MULTIPLE>

<OPTION VALUE="DOS">MS-DOS

<OPTION VALUE="WinXP">MS Windows98

<OPTION VALUE="Unix" SELECTED>UNIX

<OPTION VALUE="WinNT">MS Windows NT

</SELECT>

<INPUT TYPE="submit" VALUE="Послать">

</FORM>

...

SELECT
OPTION
 

(HTML 2.0) - Option

Используется только с элементом SELECT. Элемент OPTION описывает отдельные пункты меню. Не имеет конечного тега.

Атрибуты:

SELECTED - Определяет пункт меню, который будет выбран изначально при загрузке документа. Если меню имеет тип "один из многих", то флагом

SELECTED может быть помечен лишь один пунктов меню.

VALUE - Задает данному пункту значение, которое будет использовано наряду с другими сведениями о содержимом заполненной формы. При предоставлении информации на сервер это значение будет объединено со значением атрибута NAME в элементе SELECT.

Пример :

 

...

<FORM ACTION="script.cgi">

Мой пол

<SELECT NAME="gender">

<OPTION VALUE="male" SELECTED>Мужской

<OPTION VALUE="female">Женский

<OPTION VALUE="not_yet">Определяюсь

</SELECT>

<INPUT TYPE="submit" VALUE="OK">

</FORM>

...

OPTION
INPUT
 

(HTML 2.0) - Input

Элемент INPUT создает поле формы (кнопку, поле ввода, чекбокс и т.п.), содержание которого может быть изменено или активизировано пользователем. Элемент не имеет конечного тега. Элемент INPUT должен располагаться внутри элемента FORM.

Атрибуты:

NAME - определяет имя, используемое при передаче содержания данной формы на сервер. Этот атрибут необходим для большинства типов (атрибут TYPE - cм. ниже) элемента INPUT и обычно используется для идентификации поля или для группы полей, связанных логически.

TYPE - определяет тип поля для ввода данных. По умолчанию - это "text". Возможные значения:

  • text - создает поле ввода под одну строку текста. Как правило используется совместно с атрибутами SIZE и MAXLENGTH.

  • textarea - создает поле ввода для текста в несколько строк. Но для этих целей лучше использовать элемент TEXTAREA

  • file - дает возможность пользователю приобщить файл к текущей форме. Возможно использование совместно с атрибутом ACCEPT.

  • password - создает поле ввода под одну строку, однако текст, вводимый пользователем, отображается в виде значков "*", скрывая тем самым его содержание от любопытных глаз.

  • checkbox - создает поле ввода для атрибутов типа Boolean ("да"/"нет") или для атрибутов, которые могут одновременно принимать несколько значений. Эти атрибуты представляют собой несколько полей checkbox, которые могут иметь одинаковые имена. Каждое выбранное поле chackbox создает отдельную пару name/value в информации, посылаемой на сервер, даже если результатом будут дублирующиеся имена. Поле этого типа обязательно должно иметь атрибуты NAME и VALUE, а также необязательный атрибут CHECKED, который указывает на то, что поле активизировано.

  • radio - создает поле ввода для атрибутов, которые принимают одно значение из нескольких возможных. Все кнопки (radio buttons) в группе должны иметь одинаковые имена, но только выбранная кнопка в группе создает пару name/value, которая будет послана на сервер. Как и для полей checkbox, атрибут CHECKED необязателен; он может быть использован для определения выделенной кнопки в группе кнопок (radio button).

  • submit - создает кнопку, при нажатии которой заполненная форма посылается на сервер. Атрибут VALUE в данном случае изменяет надпись на кнопке, содержание которой, заданное по умолчанию, зависит от браузера. Если атрибут NAME указан, то при нажатии данной кнопки к информации, посылаемой на сервер, добавляется пара name/value, указанная для для атрибута SUBMIT, в противном случае пара не добавляется.

  • image - создает графическую кнопку-картинку, инициализирующую передачу данных на сервер. Местонахождение графического изображения можно задать с помощью атрибута SRC. При передаче данных серверу сообщаются координаты x и y той точки на изображении, где был произведен щелчок клавишей мыши. Координаты измеряются из верхнего левого угла изображения. При этом информация о поле типа image записывается в виде двух пар значений name/value. Значение name получается посредством добавления к названию соответствующего поля суффиксов ".x" (абсциссы), и ".y" (ординаты).

  • reset - создает кнопку, сбрасывающую значения полей формы к их первоначальным значениям. При нажатии кнопки данные на сервер не отправляются. Надпись на кнопке может быть изменена с помощью атрибута VALUE. По умолчанию надпись на кнопке зависит от версии браузера.

  • hidden - поля этого типа не отображаются на экране монитора, что позволяет разместить "секретную" информацию в рамках формы. Содержание этого поля посылается на сервер в виде name/value вместе с остальной информацией формы. Этот тип полей удобно использовать для передачи данных от скрипта скрипту незаметно для пользователя.

  • button - позволяет создать пользовательскую кнопку в HTML документе, что, при умелом использовании JavaScript, добавляет форме функциональность. Атрибут NAME позволяет задать имя данной кнопке, которое может быть использовано для какой-либо функции в скрипте. Атрибут VALUE позволяет задать текст, который будет отображен на кнопке в документе.

VALUE - задает текстовый заголовок для полей любого типа, в том числе и кнопок. Для таких полей как checkbox или radio, будет возвращено значение, заданное в атрибуте VALUE.

CHECKED - указывает, что поля типов checkbox и/или radio (см. выше атрибут TYPE) активизированы.

SIZE - определяет размер поля в символах. Например, чтобы определить поле с видимой шириной в 24 символа, надо указать SIZE="24".

MAXLENGTH - определяет максимальное количество символов, которые можно ввести в текстовом поле. Оно может быть больше, чем количество символов, указанных в атрибуте SIZE. По умолчанию количество символов не ограничено.

SRC - задает URL-адрес картинки, используемой при создании графической кнопки. Используется совместно с атрибутом TYPE="image".

ALIGN - определяет способ вертикального выравнивания для изображений. Используется совместно с атрибутом TYPE="image". Полностью аналогичен атрибуту ALIGN элемента IMG. По умолчанию имеет значение bottom.

ACCEPT - конкретизирует тип файла. Используется только совместно с параметром TYPE="file". Значение задается в виде MIME-типа.

Пример 1:

 

<FORM NAME="Form1" ACTION="http://www.igf.ru/cgi-bin/banya.pl">

<INPUT TYPE="hidden" NAME="info" VALUE="Запись в баню на воскресенье">

<INPUT TYPE="radio" NAME="sex" VALUE="Male" CHECKED> Мужик<BR>

<INPUT TYPE="radio" NAME="sex" VALUE="Female"> Баба<BR>

Имя:

<BR>

<INPUT TYPE="text" NAME="textfield" VALUE="Вася Пупкин" SIZE="30"MAXLENGTH="60"><BR>

Пароль:

<BR>

<INPUT TYPE="password" WIDTH="10" NAME="passwd"><BR><BR>

<INPUT TYPE="submit" VALUE="Запулить">

</FORM>

Пример 2:

 

Хочу получать следующие издания:<br>

<FORM NAME="Form2" ACTION="http://www.igf.ru/cgi-bin/magazines.pl">

<INPUT TYPE="checkbox" NAME="m1">Страшная газета<br>

<INPUT TYPE="checkbox" NAME="m2">6 соток<BR>

<INPUT TYPE="checkbox" NAME="m3" CHECKED>Мурзилка<BR>

<INPUT TYPE="image" src="/img/button.gif" WIDTH="60" HEIGHT="30">

</FORM>

INPUT
НАВВЕРХ
bottom of page