Передача данных формы на сервер

При передаче на сервер данные формы передаются как пары "Name"="Значение", соединенные символом '&'. "Name" - значение атрибута NAME, если оно не задано, то данные такого элемента на сервер не отправляются. "Значение" - значение атрибута VALUE, или данные, введенные пользователем. Специальные символы (!,",№, %, :, ?, *, (, ), _, +, / и др.), символы кириллицы и символ пробела преобразуются в шестнадцатеричный формат. Особенности для различных элементов формы:

text, password - передаются данные, введенные пользователем;

file - при вводе имени файла на сервер отправляется его содержимое;

checkbox, radio - данные отправляются только для выбранных (отмеченных) элементов;

reset, submit, button - данные не отправляются;

image - в передаваемые данные включаются последовательности name.x=значение-x и name.y=значение-y, где "name" - значение атрибута NAME, а значение-x и значение-y - значения координат x и y соответственно;

textarea - введенные данные отправляются с учетом значения атрибута WRAP (см. с. 9);

select - данные отправляются только для выбранных элементов OPTION.

Примеры форм

Рис. 1, форма 1

Простая форма, позволяющая пользователям вводить имя, фамилию, адрес электронной почты и пол. В случае активизации кнопки отправки форма передается программе, указанной в атрибуте ACTION.

<FORM ACTION="http://some.site.com/prog/adduser" METHOD="get">

Имя: <INPUT TYPE="text" NAME="firstname"><BR>

Фамилия: <INPUT TYPE="text" NAME="lastname"><BR>

email: <INPUT TYPE="text" NAME="email"><BR>

<INPUT TYPE="radio" NAME="sex" VALUE="Male"> Мужской <BR>

<INPUT TYPE="radio" NAME="sex" VALUE="Female"> Женский <BR>

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

</FORM>

Если введены такие данные:

Имя: Алекс

Фамилия: Petrov

email: my@mail.com

и выбран мужской пол, то на сервер будет передано: firstname=%C0%EB%E5%EA%F1&lastname=Petrov&email= my%40mail.com&sex=Male.

В следующем примере мы создадим меню, позволяющее пользователю выбрать, какую из семи программ установить. Первая и вторая программы выбраны заранее, но пользователь может отменить их выбор. Атрибут SIZE определяет, что меню должно занимать 4 строки, хотя меню содержит 6 вариантов. Доступ к другим вариантам обеспечивается с помощью механизма прокрутки. За элементом SELECT следуют кнопки отправки и сброса (рис. 2).

Рис. 2, форма 2

<FORM ACTION="http://somesite.com/prog/component-select" method="post">

<SELECT MULTIPLE SIZE="4" NAME="component-select">

<OPTION SELECTED VALUE="Component_1_a">Программа_1</OPTION>

<OPTION SELECTED VALUE="Component_1_b">Программа _2</OPTION>

<OPTION VALUE="prg3" >Программа _3</OPTION>

<OPTION VALUE="prg4" >Программа _4</OPTION>

<OPTION VALUE="prg5" >Программа _5</OPTION>

<OPTION VALUE="prg6" >Программа _6</OPTION>

</SELECT>

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

</FORM>

В этом примере создается управляющий элемент TEXTAREA в 15 строк и 40 столбцов, в котором изначально имеются две строки текста. За элементом TEXTAREA следуют стандартные кнопки отправки и сброса, а также кнопка вызова помощи (рис. 3).

Рис. 3, форма 3

<FORM ACTION="http://somesite.com/prog/text-read" METHOD="post">

<TEXTAREA NAME="thetext" ROWS="15" COLS="40">

Первая строка исходного текста.

Вторая строка исходного текста.

</TEXTAREA>

<BR><INPUT TYPE="submit" VALUE="Отправить"> <INPUT TYPE="reset"><INPUT TYPE="buttont" VALUE=" ? ">

</FORM>

Рис. 4, форма 4

А вот пример размещения формы в таблице. Это позволяет придать форме более выразительный вид - использовать выделение цветом, рамку, более точно позиционировать элементы формы. Подробно с тегами HTML, используемыми в этом примере, можно ознакомиться в [2]. Форма содержит скрытый элемент (type="hidden"), который используется для передачи на сервер параметра с именем action и значением quick.

<form ACTION="http://subscribe.ru/member/quick" METHOD="GET" TARGET="_top">

<input type="hidden" name="action" value="quick">

<table BORDER="1" CELLSPACING="0" CELLPADDING="2" width="250">

<tr><td BGCOLOR="#FCF5E9" ALIGN="CENTER"><font SIZE="-1">Рассылки </font><a HREF="http://subscribe.ru"><b>Subscribe.Ru</b></a> </td>

</tr>

<tr><td BGCOLOR="#E5DDC9" VALIGN="top">

<input TYPE="checkbox" NAME="grp" VALUE="inet.review.promo" CHECKED>

<b>ОТ ВИНТА!</b> Раскрутка сайта <br> e-mail:

<input TYPE="text" NAME="email" SIZE="20" MAXLEN="100">

<input TYPE="submit" VALUE="ОК"></td></tr></table>

</form>