Для создания интерактивного сайта используют формы для обратной связи с пользователем. Внешне формуляры состоят из набора разнообразных кнопок и текстовых полей. Обработка заполненной информации осуществляется на сервере-получателе с помощью различных сценариев, написанных на различных языках (JavaScript, VBScript, Perl, PHP и т. д.). В этом уроке мы рассмотрим только внешние аспекты.

Помните! Если вы захотите создать сайт на НАРОДЕ, то YANDEX не разрешает написание форм и предоставляет свои варианты для чата и форума.

Форма вставляется между тегами <form> и </form>. Внутри тега вы можете форматировать текст, вставлять графику и таблицы.

Атрибуты:

access-charset="кодировка" - указывает набор символов, который ожидает сервер при получении заполненной формы. По умолчанию ожидаются данные той же кодировки, что и форма. Для кирилицы = "ISO-8859-5".
action="URL" - Форма может решить свою задачу только при указании этого атрибута. Он указывает на адрес, который должен получить данные.
enctype=application/x-www-form-urlencoded | multipart/form-data - для передачи данные должны быть закодированы.

applicaiton/x-www-form-urlencoded эта установка используется по умолчанию.
multipart/form-data параметры формы передаются в самостоятельном MIME-совместимом блоке.

method="get" | "post" - для решения своих задач форма должна иметь этот атрибут.

get это значение атрибута заставляет браузер передать данные формы по указанному адресу.
post при этом значении атрибута браузер сначала связывается с сервером, обрабатывающем форму, и после получения разрешения отправляет данные.

onsubmit="script" - связывает процедуры, которые будут выполняться перед отправкой данных.
onreset="script" - связывает процедуры, котоыре будут выполняться при очистке формуляра.

Поля ввода (кнопки, текстовые поля)

Для описания полей ввода используют дескриптор <input> без концевого тега. С помощью <input> можно описать большую часть элементов ввода и управления.

accesskey="символ" - задает клавишу быстрого доступа.
align= bottom | left | middle | right | top - выравнивание в текстовой строке кнопку с иллюстрацией type=image.
(соответственно: по базовой линии строки | по левому краю | по центру текстовой строки | по правому краю | по верхей линии строки).
checked - отображает элемент, выбранный по умолчанию (см. примеры).
disabled - блокировка элемента.
readonly - элемент только для чтения.
maxlength=n - количество символов для текстовых полей ввода.
name="имя" - для присваивания уникального имени элементу (обязательный параметр).
size=n - для указания размера текстовых полей ввода (type=text и type=password)
src="URL" - адрес иллюстрации (для type=image).
tabindex="номер" - номер элемента при обходе полей нажатием клавиши [Tab].
type= checkbox | button | file | image | hidden | password | radio | reset | submit | text - Этот атрибут задает тип элемента ввода:

type=checkbox - флажки, которые не зависят друг от друга. Пример
type=file - создает поле ввода для указания файла, который пользователь пересылает на сервер вместе с формуляром.Пример
type=image - создает пользовательскую кнопку. Пример
type=hidden - передает на сервер параметры, которые не может изменить пользователь.
type=password - создает поле ввода для пароля. Текст не виден, вместо него появляются звездочки. Пример
type=radio - задает селекторные ("радио") кнопки. Можно выбрать только одну. Пример
type=reset - создает командную кнопку для сбороса содержимого формы. Пример
type=submit - создает командную кнопку, которая отправляет на сервер данные, внесенные в форму. Пример
type=text - определяет однострочное поле ввода текста. Пример

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

Поля ввода текста

Для описания многострочного поля для ввода текста используют дескриптор <textarea> и </textarea>. Между этими тегами можно разместить заранее отформатированный текст, как между тегами <pre>.

Атрибуты:

accesskey="символ" - задает клавишу быстрого доступа.
cols=n - количество столбцов.
disabled - блокировка элемента.
name="имя" - для присваивания уникального имени элементу.
readonly - элемент только для чтения.
rows=n - количество строк.
tabindex="номер" - номер элемента при обходе полей нажатием клавиши [Tab].
wrap= off | physical | virtual - сервер получает введенные данные в том же виде, как их ввел пользователь. Этот атрибут определяет верстку строк текста по правому краю.

off - верстка строк не выполняется (по умолчанию).
physical - при достижении строки правого края поля, браузер автоматически переносит текст на следующую строку. Сервер получает специальный символ в точке разрыва строки.
virtual - автоматическая верстка правой строки при достижении правого края. Но сервер получает цепочку символов без специального символа разрыва строки.

Пример использования тегов <textarea> и </textarea>.

Поле списка (разворачивающиеся меню)

Дескрипторы <select> и </select> вставляют в форму поле списка или разворачивающеся меню. Отдельные пункты меню определяются тегом <option>. Концевой тег необязателен.

Атрибуты для <select>:

disabled - блокировка элемента.
multiple - в меню можно выбрать несколько пунктов одновременно.
name="имя" - имя поля, под которым на сервер посылаются все выбранные опции.
size=n - определяет количество пунктов, отображенных одновременно в браузере.
tabindex="номер" - номер элемента при обходе полей нажатием клавиши [Tab].

Атрибуты для <option>:

disabled - элемент недоступен (блокирован).
label="текст" - текст элемента списка.
slected - выбранный по умолчанию.
value="значение" -передаваемое значение.

Пример использования тегов <seclect> и <option>.