7.1.2. Элементы управления формы
После того как объект формы будет добавлен, его необходимо наполнить содержимым – элементами управления формы. Многие элементы управления формы создаются с помощью тега <INPUT>
7.1.2.1 Поля ввода
Поля ввода предоставляют пользователю возможность ввести строку текста с информацией об имени, фамилии, контактном адресе и другие персональные данные или дать краткий ответ на вопрос.
Поля ввода создаются следующим образом:
<INPUT TYPE="text" NAME="Name" >
Помимо имени в атрибуте NAME для данного элемента управления можно устанавливать следующие атрибуты:
SIZE – ширина поля ввода в символах (по умолчанию 20 символов)
MAXLENGTH – максимально допустимое число символов в строке.
VALUE – текст, который отобразится в поле по умолчанию.
Разновидностью поля ввода является поле пароля. Это поле создается следующим образом:
<INPUT TYPE="password">
Отличительная особенность поля пароля состоит в том, что при вводе текса вместо букв отображаются символы звездочек, точек или кружочков, в зависимости от типа браузера.
Еще один тип поля ввода используется для указания пути к файлу на диске, который пользователь хочет загрузить на сервер разработчика Web-узла. Это поле создается так:
<INPUT TYPE="filet">
В окне браузера данный тип поля отображается вместе с кнопкой Обзор. Щелчок на этой кнопке открывает стандартное для операционной системы окно Выбор файла, с помощью которого можно выбрать на диске файл, предназначенный для загрузки на сервер.
Ниже показана форма с полями ввода и пароля.
<HTML>
<HEAD>
<TITLE>Текстовые поля</TITLE>
</HEAD>
<BODY BGCOLOR="#aaaaff" >
<TABLE width="45%" BORDER BGCOLOR="#ccccbb">
<TR > <TD >
<H2>Текстовые поля</H2>
<FORM METOD="post" ACTION="bin/who"><b>
В
ведите
свою фамилию. Если она длиннее десяти
символов, сократите ее.<P>
<INPUT TYPE="text" SIZE="20" NAME="Name" MAXLENGTH="10" VALUE="Фамилия"> <P>
Введите пароль в поле внизу. Максимум – 5 символов.<p>
<INPUT TYPE="password" SIZE="20" NAME="Pass" MAXLENGTH="5" >
<HR>
<INPUT TYPE="submit" VALUE="Отправить">
<INPUT TYPE="reset" VALUE="Очистить">
</FORM>
</TD></TR>
</TABLE> </BODY> </HTML>
7.1.2.2. Текстовые области
Текстовые области сходны с текстовыми полями, но с той лишь разницей, что первые имеют полосы прокрутки и внутри текстовой области можно ввести больше информации, чем в текстовом поле.
Тегом, определяющим текстовую область служит <TEXTAREA>. Атрибутами, входящими в этот тег, являются:
ROWS = – задается высота текстовой области (в пикселах)
COLS = – задается ширина текстовой области (в пикселах)
WRAP = – способ перехода текста со строки на строку. Здесь можно перечислить следующие аргументы:
VIRTUAL – символы конца строки не будут пересылаться серверу после щелчка на кнопке отправки
PHYSICAL – символы конца строки пересылаются серверу при отправке
OFF – текст продолжается как одна длинная строка, вынужденная пользователя нажимать клавишу "ENTER" для создания новых строк или использовать горизонтальную полосу прокрутки для чтения текста
NAME= – указывается название области
<HTML>
<HEAD>
<TITLE>моя первая
страничка</TITLE>
</HEAD>
<BODY>
<FORM METHOD="Post" ACTION="bin/who">
<P><TEXTAREA NAME="name" ROWS=10 COLS=40
WRAP=VIRTUAL>Здесь можно привести любой
текст
</TEXTAREA>
<P><INPUT
TYPE=SUBMIT VALUE="Отправить">
<INPUT
TYPE=RESET VALUE="Очистить">
</FORM>
</BODY> </HTML>
Браузер пересылает информацию из текстовой области серверу при щелчке на кнопке отправки. Для идентификации этой отправки к ней присоединяется название соответствующего поля.