Урок 9 HTML Формы Форма это элемент языка HTML, которая предназначена для подготовки и отправки данных для PHP скриптов (смотрите самоучитель по PHP).
Тег формы записывается в следующем виде:
<form action="..." method="..."> ..... </form>
action Указывает на ресурс, который будет обрабатывать эту форму, т.е. URL адрес PHP скрипта.
method Указывает метод передачи данных шлюзу из формы. Может принимать значения GET и POST. По умолчанию используется GET.
Поля форм Естественно просто тег формы сам работать не будет. Для того, чтобы заносить в форму какие-то данные в языке 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> посылать данные.
Значение квадрата посылается только в случае когда он отмечен, поэтому нет атрибута задающего его значение в случае неотмеченности. Если имена квадратов совпадают (а это может быть в случае нескольких выборов), то каждый квадрат создает при отправке свою пару имя/значение, а это может усложнить обработку данных, поэтому я Вам советую присваивать каждому квадрату разные имена. 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>
|