-
Формы (также их называют Web-формами), как вы помните, служат для сбора данных пользователя и отправки их Web-серверу. Они представляют собой набор из элементов управления (полей ввода, флажков, переключателей, списков и обычных кнопок), размещаемых на Web-странице.
-
Создайте в Dreamweaver новую страницу. Мы поместим в нее форму, собирающую анкетные данные пользователя и отсылающую их гипотетической серверной программе program.exe. | Чтобы поместить на Web-страницу форму, проще всего воспользоваться панелью объектов.
-
Элементы управления помещаются на форму с помощью все той же вкладки Forms панели объектов или пунктов подменю Form Objects меню Insert. Ниже мы подробно рассмотрим каждый элемент управления, предлагаемый нам стандартом HTML.
-
Кнопка – второй по популярности элемент управления в Web-формах. Для помещения ее в форму используется кнопка Button (рис. 16.8) панели объектов или пункт Button подменю Form Objects меню Insert. Доступные параметры показаны на рис. 16.9. | Рис. 16.8. Кнопка Button панели объектов | Рис. 16.9.
-
Флажки используются в формах также довольно часто. Для помещения его в форму используется кнопка Checkbox (рис. 16.10) панели объектов или пункт Check Box подменю Form Objects меню Insert. Доступные параметры показаны на рис. 16.11. | Рис. 16.10.
-
Переключатели в Web-формах, как и в обычных Windows-окнах, применяются только группами. В самом деле, в одиночку они абсолютно бесполезны – в таком случае гораздо удобнее использовать флажки. | Для помещения в форму переключателя используется кнопка Radio Button (рис.
-
Dreamweaver предоставляет удобные средства создания сразу целой группы переключателей. В самом деле, если переключатели целесообразно использовать только группой, неудобно создавать их по одному. | Чтобы создать в форме группу переключателей, нажмите кнопку Radio Group (рис.
-
Для помещения в форму обычного или раскрывающегося списка используется кнопка List/Menu (рис. 16.16) панели объектов или пункт List/Menu подменю Form Objects меню Insert. Доступные параметры показаны на рис. 16.17. | Рис. 16.16. Кнопка List/Menu панели объектов | Рис. 16.17.
-
Поле ввода имени файла позволит вам отправить серверной программе целый файл. Единственное условие: данные должны быть закодированы с использованием кодировки multipart/form-data и отправлены с помощью метода POST. | Поле ввода имени файла внешне представляет собой обычное поле ввода.
-
Графическая кнопка – это обычное графическое изображение, "по совместительству" выполняющее функцию кнопки отправки данных, т. е. при щелчке по такому изображению данные, введенные в форму, будут отправлены серверной программе.
-
Скрытое поле – это особый элемент управления, вообще не отображающийся в Web-странице. Значение, изначально присвоенное скрытому полю, не может быть изменено посетителем сайта. Можете считать, что это своего рода "тайные" данные, "спрятанные" в форме и недоступные посетителю.
-
Дополнительные элементы управления служат не для ввода данных, а для удобства посетителя страницы. Они поддерживаются только достаточно новыми программами Web-обозревателей, а именно Internet Explorer, начиная с версии 5.0, Navigator, начиная с версии 6.0, и всеми версиями Opera и Mozilla.
-
Группа элементов управления – это простой прямоугольник, объединяющий несколько элементов управления и имеющий текстовую метку. | Чтобы объединить несколько элементов управления в группу, выделите их и нажмите кнопку Fieldset (рис.
-
Теперь поговорим еще об одном элементе управления, напрямую не относящемся к формам. Это так называемый раскрывающийся список гиперссылок – обычный раскрывающийся список, содержащий список гиперссылок, ведущих на разные страницы текущего или других сайтов.
-
Dreamweaver предусматривает несколько поведений, предназначенных для работы с формами и элементами управления. (Подробнее о поведениях и работе с ними говорилось в главе 13.) Сейчас мы их рассмотрим. | Создание списка гиперссылок (Jump Menu) | Это поведение используется при создании раскрывающегося списка гиперссылок.
-
Для примера давайте создадим небольшую форму для опроса посетителей нашего сайта. В нее будут вводиться следующие данные о посетителе: | имя; | фамилия; | пол; | год рождения; | стаж работы в Интернете (новичок, опытный пользователь, гуру). | Для пробной формы этого больше чем достаточно.
-
Первая наша форма получилась не очень привлекательной на вид. Это естественно: ведь нашей задачей было научиться создавать формы, а не осваивать хитрости их форматирования. Но теперь-то мы умеем создавать формы и хотели бы научиться делать их покрасивее.
-
Итак, вы познакомились с формами и элементами управления, выяснили, как эти формы создаются и используются. Настало время завершить разговор о формах некоторыми общими рекомендациями. А касаются эти рекомендации создания привлекательного и удобного интерфейса пользователя.
