Про формы я не стал писать в описании языка HTML потому, что не зная механизма
работы с ними толку от них не добъешься. Теперь же в разделе посвященному CGI
я добрался до программирования и потребовалось описание форм...
Что же такое "формы" ?
Форма это элемент языка
HTML, которая предназначена для подготовки и отправки данных
шлюзу
CGI.
Тег формы записывается в следующем виде:
<form action="..." method="..." enctype="...">
.....
</form>
- action
- Указывает на ресурс, который будет обрабатывать эту форму, т.е. URL адрес шлюза CGI.
Все современные браузеры также могут отправлять форму по почте, для этого
предназначен специальный формат указания ресурса: "mailto:_почтовый@адрес_" (например, mailto:dron@mjk.msk.ru)
- method
- Указывает метод передачи данных шлюзу из формы. Может принимать значения GET и POST. По умолчанию используется GET.
- enctype
- Устанавливает метод кодировки данных при передаче (их MIME тип). По умолчанию установлен в application/x-www-form-urlencoded.
Для отправки по почте лучше пользоваться text/plain, хотя и для обычных шлюзов
он иногда тоже используется.
Поля форм
Естественно просто тег формы сам работать не будет. Для того, чтобы заносить
в форму какие-то данные в языке
Html существует три элемента
input,
select,
textarea.
Элемент INPUT
Элемент input обеспечивает ввод однострочных полей с информацией.
Также внутри этого элемента ничего не может быть, и поэтому закрывающая метка запрещена.
У него существует много параметров, которые задают вид вводимой информации, ее длинну и т.д.
- type
- Этот параметр устанавливает тип поля, или иначе тип вводимой информации:
- type=text
- Устанавливается по умолчанию. Задает однострочное текстовое поле ввода. Размер поля, который измеряется в количестве видимых символов, задается с помошью параметра size. Размер вводимой строки не ограничен, но при надобности может ограничиваться атрибутом maxlength. Если существует начальное значение текста, т.е. содержимое данного поля при загрузке документа, то оно задается с помощью атрибута value. Для присвоения имени полю используется атрибут name. Он для правильности должен присутствовать у любого поля в форме. Пример:
<input type=text size=45 name=file value=win.com>
- type=password
- Этот тип поля полностью аналогичен предыдущему текстовому полю, только вместо вводимых символов показывает один символ называемый символом-маской. Во многих браузерах, да и вообще системах символ-маска отображается символом звездочки.
- type=checkbox
- Предназначается для простых логических параметров или параметров, которые могут принимать множество различных значений. Отображается в виде помечаемого галочкой квадрата. Для задания имени параметра используется атрибут name, а для задания значения параметра используется value. При создании параметров, которые могут принимать много значений, имена квадратов задающих эти значения должны совпадать. Начальное состояние квадрата, т.е. отмечен он или нет, задается атрибутом checked. Этот атрибут не имеет значений и сам используется для определения отмеченности, т.е. если его нет, то квадрат не отмечен.
<input type=checkbox name=send value=yes checked> посылать данные.
Значение квадрата посылается только в случае когда он отмечен, поэтому нет атрибута задающего его значение в случае неотмеченности. Если имена квадратов совпадают (а это может быть в случае нескольких выборов), то каждый квадрат создает при отправке свою пару имя/значение, а это может усложнить обработку данных CGI шлюзами, поэтому я Вам советую присваивать каждому квадрату разные имена.
- type=radio
- Используется для выбора одного значения из списка нескольких значений. Каждая кнопка в друппе должна иметь одинаковое имя задаваемое параметром name, а также собственное значение, которое задает атрибут value. Одна радиокнока должна инициализироваться как отмеченная атрибутом checked.
Вы слушаете ?<br>
<input type=radio name=music value=rap checked> Rap
<input type=radio name=music value=pop> Pop
<input type=radio name=music value=metall> Metall
<input type=radio name=music value=classic> Classic
- type=submit
- Создает кнопку, при нажатии на которую содержимое формы будет отправляться обрабатывающему шлюзу. Текст кнопки задается атрибутом value. Если кнопка имеет атрибут name, то браузер посылает пару имя/значение при передаче данных.
Это может быть полезно для того, чтобы изменить каким-нибудь образом метод обработкии даннх шлюзом.
<input type=submit value=SEND>
- type=image
- Предназначается для создания отправляющей кнопки в виде изображения. Очень полезно если вам не нравится кнопка создаваемая браузером. Атрибут name задает имя кнопки. Для указания URL изображения используется атрибут src, также можно использовать все атрибуты, которые имеет тег изображений <IMG>.
При отправке данных браузер отправляет также координаты точки на изображении, по которой был совершен щелчок мыши.
- type=reset
- Создает кнопку, которая по назначению является противоположной Submit. Короче эта кнопка сбрасывает все значения в форме и устанавливает их по умолчанию или заданные при инициализации,т.е. атрибутами value.
- type=file
- Это поле предназначается для вставки в отправляемые данные содержимого файла, имя которого пользователь набирает в текстовом поле. Современные, а тем более графические браузеры отображают рядом с текстовым полем кнопку, при нажатии на которую можно выбрать файл в интерактивном режиме. Для управления шириной и максимальной длинной текста используются атрибуты size и maxlength, также как в type=text.
Некоторые браузеры поддерживают ограничение на передачу файлов определенных типов. Список разрешенных типов MIME указывается с помощью атрибута accept.
<input type=file name=mpeg size=40 maxlength=300 accept="video/mpeg">
- type=hidden
- Эта штука используется для отправки данных шлюзам, которые не отбражаются на странице и их значения пользователь задать не может. Почти всегда используется для хранения служебной информации. Обазательно должны содержать атрибуты name и value
<input type=hidden name=color value=black">
- name
- Используется для задания имени полю формы.
- value
- Используется для задания начального значения поля.
- checked
- Устанавливает признак отсеченности в полях типа checkbox и radio
- size
- Устанавливает видимый размер текстовых полей.
- maxlength
- Устанавливает маскимальную длинну текста, который можно ввести в текстовые поля.
- src, align и т.д.
- Атрибуты, которые использует графическая кнопка. Подробнее о них в описании тега <img>
Элемент SELECT
Создает меню, из которого можно выбрать один или несколько элементов. Элемент
select должен иметь закрывающую метку. Внутри него размещаются элементы
option, которые задают значения пунктов меню. Меню имеющие возможность выбора нескольких элементов отображается в виде списка, при выборе только одного элемента меню отображается в виде выпадающего.
Элемент select имеет следующие атрибуты.
- name
- Указавае имя меню, которые будет использоваться при передаче. Вобщем-то все аналогично предыдущим элементам.
- size
- Этот атрибут устанавливает высоту меню в строках, если оно имеет возможность выбора нескольких элементов.
- multiple
Присутствие этого атрибута указывает на возможность выбора нескольких элементо меню.
Атрибуты элемента option
- selected
- Указывает на то, что этот элемент меню инициализируется как выделенный при загрузке документа.
- value
- Указывает значение, которое будет передано обработчику формы вместе с атрибутом name, указанного в теге select.
Элемент
option может не иметь закрывающей метки.
Пример:
<select name=color>
<option value=red checked> Red
<option value=green> Green
<option value=blue> Blue
</select>
Элемент TEXTAREA
Элемент
textarea создает текстовое поле в форме. Если элемент имеет закрывающую метку, то все что заключено между метками считается инициализирующим содержимым, т.е. имеет такое же значение, как и атрибут
value у предыдущих элементов.
Этот элемент может иметь следующие атрибуты:
- name
- Думаю ясно для чего этот атрибут :-).
- rows
- Устанавливает высоту видимого размер поля для ввода текста. Задается в виде количества видимых строк текста.
- cols
- Устанавливает количество видимых сиволов в строке.
Если введенный текст не помещается в область выделенную для ввода, то браузер должен обеспечить прокрутку содержимого.
<textarea name=text cols=60 rows=15>
Сюда вы должны ввести текст :-)
</textarea>
Вобщем я рассказал про формы почти все, если только ничего не забыл... Если вдруг что, то ждите пополнений :-)