Создание HTML-форм: другие тэги

назад

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

Текстовые окна

Обычно поле для ввода текста в одну строку удобно во многих случиях, но иногда вам может понадобиться создать большое окно для ввода нескольких строк, например на форуме, или для того, чтобы узнать мнение пользователя о некотором предмете. В таком случае вам не обойтись без тэга <TEXTAREA>. В отличии от тэга <INPUT>, текстовое окно имеет как открывающий, так и закрывающий тэги. Любой текст, введенный между ними, выводится в текстовом окне. Вот код текстового окна:

<center>
<TEXTAREA name="example" COLS=40 ROWS=2>
Это просто пример
</TEXTAREA>
</center>

Атрибуты COLS и ROWS задают размеры окна в символах. Как и у других полей, атрибут NAME позволяет идентифицировать поле при передаче данных серверу.

У текстового окна есть важный атрибут WRAP. Он управляет отображением текста в окне, а именно тем, как текст ведет себя у правого края окна. Этот атрибут может иметь одно из трех значений - none, physical и virtual. Если установлено значение none, то текст вводится, не переходя на новую строку, пока пользователь не нажмет клавишу ENTER.

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

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

<TEXTAREA name="example" WRAP="none" ROWS=3 COLS=40>
</TEXTAREA>

Если вам нужно создать действительно пустое окно, не содержащее ни одного символа, вы должны делать это так:

Списки

Список позволяет пользователю выбрать из него один или несколько пунктов, перед тем как отправить форму на сервер. Для создания списка предназначены тэги <SELECT> и <OPTION>. Тэг <SELECT> состоит из открывающей и закрывающей части и служит для определения всего списка всего списка, а тэг <OPTION> состоит только из открывающей части и определяет один элемент списка.

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

По умолчанию значение атрибута SIZE имеет значение 1. Тэг <OPTION> имеет только один атрибут - VALUE. Значение этого атрибута передается на сервер, если выбран соответствующий элемент. Вот создан список из одной строки:

<SELECT name="color">
<OPTION VALUE="red">Красный
<OPTION VALUE="blue" SELECTED>Синий
<OPTION VALUE="yellow">Желтый
</SELECT>

Флаг SELECTED указывает, какой элемент выделен в списке по умолчанию.

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

<SELECT name="os" size="3">
<OPTION VALUE="macos">Mac OS
<OPTION VALUE="linux">Linux
<OPTION VALUE="freebsd">FreeBSD
<OPTION VALUE="windows">Windows
</SELECT>