Форма - инструмент, с помощью которого HTML-документ может послать информацию в заранее определенную точку внешнего мира, где информация будет обработана. В качестве такой точки обычно выступает программа.
   Программы, обрабатывающие данные переданные формами, обычно называют CGI-скриптами.

Определенное распространение получил язык PHP/FI, инструкции которого можно встраивать прямо в HTML-документы (документы при этом сохраняются в виде файлов с расширением *.pht или *.php).

Формы передают информацию программам-обработчикам в виде пар: Name="значение".
   Имена при этом следует задавать латинскими буквами.

Форма открывается тегом <FORM> и заканчивается соответственно тегом </FORM>.
   HTML-документ может содержать в себе несколько форм, однако формы не должны находиться одна внутри другой.

HTML-текст, включая разметку текста, может размещаться внутри форм без ограничений.




Тег <FORM> может содержать три атрибута, один из которых является обязательным:

ACTION - Обязательный атрибут - где находится обработчик формы.

METHOD - определяет каким образом данные из формы будут переданы обработчику. Допустимые значения: METHOD="POST" и METHOD="GET".
   Если значение не установлено, по умолчанию назначается - METHOD="GET".

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




Чтобы запустить процесс передачи данных из формы обработчику, нужен орган управления:
   <INPUT TYPE=submit>


Встретив такую строчку, браузер нарисует на экране кнопку с надписью Submit (отправить), при нажатии на которую все имеющиеся в форме данные будут переданы обработчику, определенному в теге <FORM>.

Вместо Submit (Отправить) можно задать любую другую надпись на кнопке, путем введения атрибута VALUE="Надпись". Например:
   <INPUT TYPE=submit VALUE="Start">





Простейшая форма:

<FORM ACTION="https://www.facebook.com/Gonchij1/">
<INPUT TYPE="submit" VALUE="Gonchij">
</FORM>




Саму надпись, нанесенную на кнопку, тоже можно передать обработчику, путем введения атрибута NAME="имя". Например:
   <INPUT TYPE="submit" NAME="button" VALUE="Start">

При нажатии на такую кнопку обработчик вместе со всеми остальными данными получит и переменную button со значением Start.

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




Существуют и другие типы элементов <INPUT>. Каждый элемент <INPUT> должен включать атрибут NAME="имя", - имя переменной, которая будет передана обработчику.

Большинство элементов <INPUT> должны включать атрибут VALUE="значение", - значение, которое будет передано обработчику под этим именем.
   Для элементов <INPUT TYPE="text"> и <INPUT TYPE="password"> этот атрибут не обязателен, поскольку значение соответствующей переменной (текст или пароль) может вводить сам пользователь.




Основные типы элементов <INPUT>:

TYPE="text" - окно для ввода текста. Может содержать дополнительные атрибуты SIZE="число" (ширина окна в символах) и MAXLENGTH="число" (максимально допустимая длина вводимой строки в символах):
   <INPUT TYPE="text" SIZE="15" NAME="user">




Окно шириной 15 символов для ввода текста - текст передаcтся обработчику в переменной user.



TYPE="password" - окно для ввода пароля. Аналогичнo типу text, только вводимый текст тут же преобразуется в звездочки (*):
   <INPUT TYPE="password" NAME="pw" SIZE="15">




Окно шириной 15 символов для ввода пароля. Введенный пароль передается обработчику в переменной pw.



TYPE="radio" - радиокнопкa. Может содержать дополнительный атрибут checked (кнопка заведомо помечена).
   В группе радиокнопок с одинаковыми именами может быть только одна помеченная радиокнопка.

Пример:

<INPUT TYPE="radio" NAME="modem" VALUE="9600" checked> 9600 bit/s
<INPUT TYPE="radio" NAME="modem" VALUE="14400"> 14400 bit/s
<INPUT TYPE="radio" NAME="modem" VALUE="28800"> 28800 bit/s

9600 bit/s
14400 bit/s
28800 bit/s

Группа из трех радиокнопок, подписанных 9600 bit/s, 14400 bit/s и 28800 bit/s. Первоначально помечена первая из кнопок. Если пользователь не отметит другую, обработчику будет передана переменная modem со значением 9600.
   Если пользователь отметит другую кнопку, обработчику будет передана переменная modem со значением 14400 или 28800.




TYPE="checkbox" - квадрат, в котором можно сделать пометку. Может содержать дополнительный атрибут checked (квадрат заведомо помечен).
   В отличие от радиокнопок, в группе квадратов с одинаковыми именами может быть несколько помеченных квадратов.

<INPUT TYPE="checkbox" NAME="comp" VALUE="PC"> Накрыться медным тазом
<INPUT TYPE="checkbox" NAME="comp" VALUE="WS" checked> Чайку с плутонием
<INPUT TYPE="checkbox" NAME="comp" VALUE="LAN"> На ПМЖ в Чернобыль
<INPUT TYPE="checkbox" NAME="comp" VALUE="IS" checked> «Все будет хорошо»

Накрыться медным тазом
Чайку с плутонием
На ПМЖ в Чернобыль
«Все будет хорошо»

Группа из четырех квадратов. Первоначально помечены второй и четвертый.
   Если пользователь не произведет изменений, обработчику будут переданы две переменные: comp="WS" и comp="IS".




TYPE="hidden" - скрытый элемент данных. Не виден пользователю при заполнении формы и передается обработчику без изменений.
   Такой элемент иногда полезно иметь в форме, которая время от времени подвергается переработке - чтобы обработчик мог знать, с какой версией формы он имеет дело:

<INPUT TYPE="hidden" NAME="version" VALUE="1.1"> - скрытая переменная version, которая передается обработчику со значением 1.1.




TYPE="reset" - кнопка, при нажатии на которую форма возвращается в исходное состояние.
   Поскольку при использовании этой кнопки данные обработчику не передаются, кнопка типа reset может и не иметь атрибута name:

<INPUT TYPE="reset" VALUE="Sbros">




Кнопка Sbros, при нажатии на которую форма возвращается в исходное состояние.



Помимо элементов <INPUT>, формы могут содержать меню <SELECT> и поля для ввода текста <TEXTAREA>.

Меню <SELECT> (Выбрать):

<SELECT NAME="menyu">
<OPTION VALUE="1">http://q2212.narod.ru
<OPTION VALUE="2">http://gonchij1.livejournal.com
<OPTION VALUE="3">https://www.facebook.com/Gonchij1
</SELECT>




Меню начинается с метки <SELECT> и заканчивается соответственно меткой </SELECT>.

Метка <SELECT> содержит обязательный атрибут NAME - имя которoe генерирует меню.

Метка <SELECT> может также содержать атрибут MULTIPLE, присутствие которого показывает, что из меню можно выбрать несколько элементов.
   Большинство браузеров показывают меню <SELECT MULTIPLE> в виде окна, в котором находятся элементы меню (высоту окна в строках можно задать атрибутом SIZE="число").

Меню <SELECT> в большинстве случаев показывается в виде выпадающего меню.

Метка <OPTION> - элемент меню. Обязательный атрибут VALUE устанавливает значение, которое будет передано обработчику, если выбран этот элемент меню.
   Метка <OPTION> может включать атрибут checked, показывающий, что данный элемент отмечен по умолчанию.




Наконец элемент <TEXTAREA>:

<TEXTAREA NAME="address" ROWS="3" COLS="60">
Случалось видеть кошмар, который казался реальностью?
</TEXTAREA>




Все атрибуты обязательны.
NAME - имя, под которым содержимое окна будет передано обработчику (address).
ROWS - высотa окна в строках (3).
COLS - ширинa окна в символах (60).
Текст, размещенный между метками <TEXTAREA> и </TEXTAREA> - содержимое окна по умолчанию. Пользователь может его отредактировать или просто стереть.

Русские буквы в окне <TEXTAREA> при передаче обработчику могут быть конвертированы в соответствующие им символьные объекты.




Более сложная форма:

<FORM ACTION="http://206.31.82.215/hp/nc/fd-win.pht" METHOD="post">
<b>О себе.</b><br>
Имя: <INPUT TYPE="text" SIZE="20" NAME="fn"><br>
Фамилия: <INPUT TYPE="text" SIZE="20" NAME="ln"><br>
Пол:
<INPUT TYPE="radio" NAME="gender" VALUE="male">мужской
<INPUT TYPE="radio" NAME="gender" VALUE="female">женский<br>
Возраст: <INPUT TYPE="text" SIZE="10" NAME="age"><br>
<INPUT TYPE="submit" VALUE="Start">
</FORM>

О себе
Имя:
Фамилия:
Пол:
мужской
женский
Возраст:





Для чего могут быть нужны формы людям, которым их нечем обработать? HTML - это мощный механизм пересылки содержимого форм и по электронной почте.

Допустим, что Вместо строки:
<FORM ACTION="http://206.31.82.215/hp/nc/fd-win.pht" METHOD="post">
Прописывается:
<FORM ACTION="mailto:q2212@yandex.ru" ENCTYPE="text/plain">


О себе
Имя:
Фамилия:
Пол:
мужской
женский
Возраст:



B данном случае изменен и алгоритм кодирования - на text/plain - простой текст. Фактически кодирование выключено вообще.

Теперь, все введенные в форму данные, при нажатии вводившим кнопки Start, будут в форме обычного сообщения отправлены на адрес электронной почты q2212@yandex.ru:
fn=Иван
ln=Петров
gender=male
age=22

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

Но даже если это невозможно, ничего особого не случится. Браузер просто выдаст сообщение об ошибке. Например такое: «С запрошенным действием не связана программа электронной почты. Установите программу электронной почты или, если она уже установлена, создайте связь в панели управления "Программы по умолчанию".»


Поддержать автора


Карта сайта
Мой адрес Электронной почты: q2212@yandex.ru
Номер моего мобильного телефона: +79030100732