Поиск

Элементы форм

<ISINDEX>

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

<ISINDEX prompt="Crpora для ввода критерия поиска">

Данный элемент позволит создать поле ввода, показанное на рис. 4.3. Работа это го элемента связана с определенным на текущей странице базовым URL. Допус тим, задан базовый адрес:

<BASE href="http://www.название.домен/путь">

Значение атрибута href должно представлять собой адрес некоторого поискового средства в Интернете. Если пользователь введет в поле элемента ISINDEX последова тельность ключевых слов (слово"!, слово2, словоЗ), то броузер сформирует запрос:

http://www.название.домен/?слово1+слово2+словоЗ

Эта строка будет отправлена на сервер для активизации поисковой машины. Тео ретически этот метод очень удобен, но на практике его применение ограничивает ся тем, что не все поисковые программы поддерживают стандартный синтаксис запроса. Я имею в виду использование знаков «?» и «+». Поэтому данный прием годится только для некоторых поисковых серверов.
Стандартные атрибуты: id, class, lang, d i r , title, style.

<FORM> </form>

Этот элемент необходим для построения достаточно сложных форм. После заполне ния формы и подтверждения ввода со стороны пользователя, введенная информа ция пересылается на сервер и обрабатывается при помощи CGIпрограммы, связан ной с формой. Атрибут action должен указывать на имя программы, например:

<FORM action="http://www. название.домен/имя программы" method="post">
Элементы формы
</form>

Одним из вариантов обработки формы может быть пересылка данных по элек тронной почте:

action="mailto:Aqpec(5)cepeep. домен"

С помощью атрибута method можно задать протокол для пересылки данных на сервер. Протокол GET используется по умолчанию, но в большинстве случаев он не удовлетворяет разработчиков, поэтому чаще используется протокол POST. Атрибут enctype позволяет указать способ кодирования содержимого формы. Форму заполняют разные пользователи, поэтому для нее предусмотрен атрибут, который позволяет определить список допустимых кодировок:

acceptcharset="список кодировок"

Можно также определить список допустимых типов данных:

accept="список типов данных"

Большинство форм снабжаются кнопками, которые позволяют очистить (reset" форму или подтвердить (submit) правильность ее заполнения и отослать дан ные. Чтобы определить программысценарии, которые должны выполнятьс* после указанных действий пользователя, существуют два атрибута событий onsubmit и on reset.

Стандартные атрибуты: id, class, lang, style, dir, title, target, атрибуты событий

<INPUT>

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

  • type="text" — создание поля ввода, в котором можно автоматически разместит! произвольный текст, используя атрибут value;
  • type="password" — создание поля для ввода пароля, причем введенная ин формация отображается звездочками;
  • type="checkbox" — создание флажка;
  • type="radio" — определение одного переключателя.

Для создания группы пе реключателей необходимо использовать несколько элементов INPUT. Вот при мер группы из трех переключателей:

<НЗ> Переключатели </h3>
<INPUT type="radio" name="S001" уа!ие="Первый">
<INPUT type="radio" name="S001" уа!ие="Второй">
<INPUT type="radio" name="S001" уа!ие="Третий" checked>

Атрибут checked определяет, какой из переключателей должен быть выбран по умолчанию. На рис. 4.4 показан внешний вид этой группы переключателей.

  • type="button" — создание кнопки произвольного назначения;
  • type="submit" — создание кнопки, щелчок на которой подтверждает ввод информации в форму. Атрибут value используется для определения надписи на кнопке;
  • type="reset" — тоже кнопка, но для отмены ввода данных в форму;
  • type="image" — создание кнопки с рисунком. Для указания графического файла используется атрибут src. Атрибут align предназначен для позиционирова ния кнопки с рисунком. Значения атрибута уже неоднократно упоминались: bottom, left, middle, right, top. Пользоваться этим атрибутом в данном случае я не рекомендую, так как не все броузеры его поддерживают;
  • type="f ile" — средство выбора файла для присоединения к форме. Пользова телю предлагается записать имя файла в поле ввода. Кроме того, броузер авто матически создает рядом с полем ввода кнопку Обзор, которая позволяет запу стить стандартный (для операционной системы) диалог выбора файлов;
  • type="hidden" — скрытый от пользователя элемент. Такие элементы использу ются для того, чтобы включить в набор данных формы некую фиксированную информацию. По сути, это определение имени переменной и ее значения.

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

Атрибут name должен присутствовать во всех элементах INPUT, кроме кнопок под тверждения и сброса. Значение этого атрибута определяет имя поля формы, то есть блока данных, введенных в это поле. Программа сервера по этому имени мо жет выделить необходимые данные.

Область применения атрибута value нам уже известна. Значение атрибута задает значение по умолчанию для поля ввода или определяет надпись на кнопке. Выше было показано, как с помощью атрибута checked создать группу переклю чателей. Точно таким же способом этот атрибут может быть использован и для флажков. Его наличие показывает, что флажок должен быть установлен по умол чанию. В отличие от переключателей, одновременно может быть установлено любое количество флажков.

Атрибут size позволяет задать длину поля ввода. Длина выражается в символах, но эта величина может быть задана только приближенно. Чтобы разместить в поле ввода определенное количество символов, потребуется подбор значения ат рибута. При этом никто не может дать гарантию, что все броузеры обеспечат тре буемую длину строки, а не меньшую. Таким образом, длину поля ввода необходи мо выбирать с запасом.

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

Атрибут readonly позволяет создать элемент, недоступный для редактирования. Атрибут usemap (см. выше раздел «Рисунки и карты») может использоваться, если в форме создается карта.

Так же, как и в FORM, в элементе INPUT можно указывать атрибут accept.
Допустимые общие атрибуты: accesskey, tabindex, readonly, disabled.
Стандартные атрибуты: id, class, lang, title, dir, style, атрибуты событий.

Используя элементы FORM и INPUT, можно создать объект, который заменит анало гичный объект, созданный на основе элемента ISINDEX. Приведенный ниже код выполняет те же функции, что и код, посвященный элементу ISINDEX (см. рис. 4.3):

<FORM action="действие" method="post">
<Р>Строка для ввода критерия поиска <BR>
<INPUT type="text">
</form>
<LABEL></label>

Этот элемент является контейнером для других элементов формы. Например можно объединить надпись и поле ввода:

<LABEL>flaffl адрес: <INPUT type="text" id="arfres"x/label>

Если элемент LABEL и другой элемент находятся отдельно, используется атрибут for, значение которого должно совпадать со значением атрибута id соответствую щего элемента:

<LABEL Tor="adress">Baui адрес: </label>
<INPUT type="text" id="adress">

Для каждого элемента LABEL создается один элемент формы. Иногда элементы удобно распределить по ячейкам таблицы, обеспечив тем самым выравнивание данных в форме.

Стандартные атрибуты: accesskey, id, class, lang, dir, title, style, атрибуты событий.