ГЛАВА 16
Формы
Формы (также их называют Web -формами), как вы помните, служат для сбора данных пользователя и отправки их Web -серверу. Они представляют собой набор из элементов управления (полей ввода, флажков, переключателей, списков и обычных кнопок), размещаемых на Web -странице. В этом смысле они аналогичны обычным диалоговым окнам Windows -приложений и работают так же.
Web -формы — такой же часто встречающийся элемент страниц, как, скажем, графические изображения или таблицы. Очень и очень многие сайты содержат анкеты для опроса посетителей. Почтовые системы, работающие через Web -обозреватель (" Web -почта"), спрашивают у вас кодовое имя (или, как говорят опытные интернетчики, "логин", поанглийски — login ) и пароль прежде, чем допустить к содержимому вашего почтового ящика. Разнообразные сайты-справочники предусматривают возможности поиска, для чего предоставляют специальные формы с полем ввода, где вы должны будете ввести ключевое слово. А электронные магазины требуют у вас почтовый адрес, чтобы отправить вам купленный товар.
Интернет становится все более и более интерактивным, и в дальнейшем эта тенденция будет только нарастать. А для интерактивности ему нужно принимать данные от своих пользователей. Единственный в настоящее время способ сделать это - использовать серверные программы и, разумеется, формы.
О серверных программах подробно говорилось в главе 15. Так что не будем повторять все это, а сразу перейдем к работе с формами в среде Dreamweaver .
Работа с формами в Dreamweaver
Создайте в Dreamweaver новую страницу. Мы поместим в нее форму, собирающую анкетные данные пользователя и отсылающую их гипотетической серверной программе program.exe .
Создание формы
Чтобы поместить на Web -страницу форму, проще всего воспользоваться панелью объектов. Для этого переключитесь на вкладку Forms , где находятся кнопки, помещающие на Web -страницу форму или один из предусмотренных в HTML элементов управления. Кнопка, помещающая на страницу форму, называется Form . Также вы можете выбрать пункт Form в меню Insert .
Пустая форма показывается в виде узкой полоски, ограниченной красной пунктирной рамкой. Когда вы поместите что-нибудь в форму, ее размеры соответственно увеличатся.
Вновь созданная форма будет сразу же выделена, чтобы вы смогли установить нужные параметры. К несчастью, это никак не сигнализируется визуально: выделенная форма ничем не отличается от невыделенной. Поэтому, если вы сомневаетесь, выделена ли форма, выделите ее сами. Для этого просто щелкните мышью по ее красной штриховой рамке.
Что может быть бесполезнее пустой формы! Поэтому мы не будем останавливаться на ней, а поскорее перейдем к элементам управления. Опишем только, какие параметры вы можете задать для формы. А параметров этих очень и очень немного.
Сначала о поле ввода Form Name . В нем вводится имя формы. По умолчанию Dreamweaver сам подставляет туда автоматически сгенерированное имя вида form 1, form 2 и т. д. В подавляющем большинстве случаев автоматически сгенерированного имени будет вполне достаточно; вообще, имя формы особой роли не играет, в отличие от имен элементов управления. Но если вы любите аккуратность во всем, можете задать для своей формы более вразумительное имя.
Имя формы вы также можете задать, выбрав пункт Name в контекстном меню формы (т. е. контекстном меню, появляющемся при щелчке правой кнопкой мыши по форме). После этого на экране появится диалоговое окно Change Attribute . Введите новое значение параметра в поле ввода и нажмите кнопку ОК для его сохранения или Cancel — для отмены.
В поле ввода Action вводится интернет-адрес серверной программы, которая будет обрабатывать введенные в форму данные. Вы можете также щелкнуть по значку папки справа от этого поля ввода и выбрать нужный файл в диалоговом окне Select File . Кроме того, вы можете выбрать пункт Action контекстного меню формы, чтобы вызвать на экран все то же диалоговое окно.
В комбинированном списке Target задается, как вы помните, цель гиперссылки. Конечно, сейчас у нас нет гиперссылки — в данном случае цель задает, куда будет выводиться Web -страница, сгенерированная серверной программой.
Метод пересылки данных задается с помощью раскрывающегося списка Method . В этом списке доступны три пункта: GET , POST и Default . Первые два пункта, как вы поняли, задают метод пересылки, а третий — метод, используемый по умолчанию (как правило, GET ). Для аналогичных целей служит подменю Method контекстного меню формы, содержащее все те же три пункта.
Кодировка данных формы задается в комбинированом списке Enctype . В этом списке есть два пункта: application / x - www - form - urlencoded и multipart / form - data . Если вы собираетесь использовать другую кодировку, например, text / plain , можете ввести ее название прямо в этот список.
Примечание
Форма создается с помощью парного тега < form >. . .</ form >, внутри которого помещается все содержимое формы , т . е . элементы управления . Атрибут action задает адрес серверной программы , enctype — кодировку , a method - метод отправки данных .
Задайте какиенибудь данные для нашей формы. И сохраните страницу в файле под именем
6.1.htm .
Вот и все о форме. Теперь пора наполнить ее содержимым.
Элементы управления
Элементы управления помещаются на форму с помощью все той же вкладки Forms панели объектов или пунктов подменю Form Objects меню Insert . Ниже мы подробно рассмотрим каждый элемент управления, предлагаемый нам стандартом HTML .
Элементы управления вставляются в "поток" текста и ведут себя как обычные элементы страницы. Вы можете разносить их по текстовым абзацам или помещать в одну и ту же строку, разделяя пробелами. Также вы можете вставлять их в ячейки таблицы и свободно позиционируемые элементы. Чтобы удалить ненужный элемент управления, просто выделите его и нажмите клавишу < Del >.
