Добавить в избранное  ||  Использование компонентов  ||  Введение  ||  Приложение Установка программы FrontPage

Глава 22 Создание форм

Шаблоны и мастера для создания форм
Создание формы с помощью мастера
Редактирование объектов формы и определение их свойств
Текстовые объекты
Настройка объектов, размещенных в форме
Поле ввода
Поле ввода большой длины
Использование флажков в форме
Переключатель
Списки
Кнопки управления
Свойства формы
Вкладка Результаты в файл
Вкладка Отправка результатов по почте
Вкладка Страница подтверждения
Вкладка Сохраняемые поля
Настройка пользовательских обработчиков
Самостоятельная разработка формы
Инструменты, используемые для размещения в форме объектов
Разработка формы

Шаблоны и мастера для создания форм

Во всех предыдущих главах мы рассматривали размещение на Web-страницах информации, предназначенной для ознакомления посетителей с определенными сведениями. Однако, путешествуя по Web-узлам Интернета, вы, вероятно, обращали внимание на те страницы, которые предлагают посетителям ввести разнообразную информацию. Это и различное анкетирование, и заказ товаров по Интернету, и подписка на рассылку материалов. Во всех этих случаях разработчики Web-узла использовали формы, позволяющие посетителям не просто просматривать, но и вводить информацию. Вам, возможно, тоже захочется использовать форму в своем Web-узле для тех или иных целей, например, чтобы узнать мнение пользователей о вашем Web-узле.

Формы содержат объекты, позволяющие вводить информацию: поля, где вводится информация, списки, содержащие варианты ответов, из которых посетителю необходимо выбрать вариант, группы переключателей, в которых необходимо установить соответствующую опцию, флажки, предполагающие два варианта ответа — согласен или не согласен. Формы содержат также и кнопки, позволяющие выполнять определенные действия, например, переслать на сервер для дальнейшей их обработки введенную в поля информацию или очистить поля ввода формы.

Форма может занимать целую Web-страницу или ее часть. Ее размер будет зависеть от того, сколько сведений вы хотите получить от посетителя Web-узла. Поля формы на Web-странице выделяются контурной пунктирной рамкой. При разработке формы необходимо тщательно продумать, какие объекты будут использоваться. Не стоит делать форму с большим количеством полей, в которые требуется вводить информацию. Лучше ограничиться несколькими полями такого типа, а для получения сведений на интересующие вопросы разместить в форме опции с вариантами возможных ответов или флажки, установка которых предполагает согласие с предложенным вопросом.

Для создания форм, так же как и для создания Web-страниц, программа FrontPage предлагает шаблоны и мастера. Их использование облегчает разработку. Казалось бы, чего здесь сложного: разместил объекты и все. Но на этом создание формы не заканчивается. Каждый объект обладает целым набором свойств, требующих настройки. Кроме того, для обработки данных, введенных в форме, необходимы специальные приложения на Web-сервере, называемые обработчиками. В их задачу входит получение и обработка введенной информации. Их также нужно настроить. При использовании шаблонов вы получаете готовую к применению форму и избавляете себя от необходимости дополнительной настройки ее объектов.

Чтобы просмотреть список шаблонов и мастеров форм, предлагаемых программой FrontPage, в меню File (Файл) выберите команду Создать (New), а затем значение Страница или веб-узел (Page or Web). На появившейся панели Создание веб-страницы (Page or Web) выберите команду Шаблоны страниц (Page Templates). В результате на экране открывается аналоговое окно Шаблоны страниц, представленное на рис. 22.1. Оно содержит три вкладки. Шаблоны и мастера Web-страниц и форм расположены на вкладке Общие (General).

Рис. 22.1. Диалоговое окно Шаблоны страниц, содержащее шаблоны и мастера для создания формы

В табл. 22.1 представлен список шаблонов и мастеров форм, предоставляемых программой FrontPage.

Таблица 22.1. Шаблоны и мастера для создания форм

Создание формы с помощью мастера

В списке шаблонов форм, предлагаемых программой FrontPage, присутствует мастер создания формы для опроса посетителей. Рассмотрим его работу. Чтобы создать форму с помощью мастера, выполните следующие действия:

1. Откройте Web-узел, в котором хотите разместить форму.
2. В меню Файл (File) выберите команду Создать (New), а затем — опцию Страница или веб-узел (Page or Web).
3. На появившейся панели Создание веб-страницы выберите команду Шаблоны страниц (Page Templates). В результате на экране открывается диалоговое окно Шаблоны страниц.
4. На вкладке Общие (General) дважды щелкните на значке Мастер страницы формы (Form Page Wizard).
5. Запускается мастер по созданию формы и появляется его первое окно. Ознакомьтесь с предложенной вашему вниманию информацией о назначении создаваемой с его помощью формы и нажмите кнопку Далее (Next).
6. Открывается диалоговое окно мастера (рис. 22.2), которое содержит область для размещения списка формируемых вопросов.

Окно мастера содержит кнопки:

• Добавить (Add) — открывает диалоговое окно для выбора темы, по которой будет формироваться вопрос
• Изменить (Modify) — открывает диалоговое окно мастера, позволяющее изменить сформированный вопрос
• Удалить (Remove) — удаляет из списка выделенный вопрос
• Вверх (Move Up) — перемещает выделенный в списке вопрос на один уровень вверх
• Вниз (Move Down) — перемещает выделенный в списке вопрос на один уровень вниз
• Очистить (Clear List) — очищает список, удаляя из него все вопросы Для формирования вопроса нажмите кнопку Добавить.

Рис. 22.2. Диалоговое окно для формирования списка вопросов

7. В верхней части открывшегося диалогового окна содержится список тем, по которым можно формировать вопросы. Щелкните мышью на требуемом значении из этого списка. В области Описание (Description) появляется краткое описание полей, помещаемых в форму по выбранной теме. В поле Измените приглашение для этого вопроса (Edit the prompt for this question) предлагается вариант формируемого вопроса. Скорректируйте вопрос (рис. 22.3) и нажмите кнопку Далее.

Рис. 22.3. Диалоговое окно для выбора темы, по которой будет формироваться вопрос

8. Следующее диалоговое окно (рис. 22.4) предназначено для выбора полей, размещаемых в форме по сформированному вопросу. При установленном флажке ФИО (Name) становятся активными расположенные под ним опции, позволяющие указать, сколько полей будет создаваться для ввода имени посетителя. По умолчанию установлена опция полное имя (full), при которой для ввода имени предлагается одно поле. Установка второй и третьей опций приводит к тому, что для ввода имени выделяется два и три поля, соответственно. Например, если вы хотите, чтобы посетители вводили фамилию, имя и отчество в отдельных полях, установите опцию имя, фамилия, отчество (first, last, middle).

Ниже опций расположены флажки, позволяющие включить в форму поля для ввода названия организации, почтового адреса, рабочего и домашнего телефонов, номера факса, адреса электронной почты, адреса Web-страницы. Установите необходимые флажки, если хотите разместить в форме эти поля.

В поле Введите базовое имя для этой группы переменных (Enter the base name for this group of variables) указано наименование для группы переменных Contact. Оставьте его без изменения. Завершив установку параметров, нажмите кнопку Далее.

Рис. 22.4. Диалоговое окно для формирования списка полей

9. На следующем шаге мастера открывается диалоговое окно, показанное ранее на рис. 22.2. Только теперь оно в списке вопросов содержит первый сформированный вопрос. Для добавления в список нового вопроса нажмите кнопку Добавить (Add), сформируйте в следующих двух диалоговых окнах вопрос и выберите поля для ввода данных. 10. Повторяя шаги с 6 по 9, сформируйте список всех вопросов. Для модификации введенного ранее вопроса установите на него курсор и нажмите кнопку Изменить (Modify), а затем в открывшихся диалоговых окнах измените вопрос или формируемые по нему поля формы.
11. Сформировав список вопросов и полей формы, нажмите кнопку Далее.
12. Открывается диалоговое окно, позволяющее задать оформление формы (рис. 22.5). Оно содержит две группы опций и флажок.

Рис. 22.5. Диалоговое окно, содержащее параметры для оформления формы

Переключатель Выберите способ представления списка вопросов (How should the list of questions be presented) содержит опции, позволяющие задать вид оформления вопросов, содержащихся в форме:

• обычные абзацы (as normal paragraphs)
• нумерованный список (as a numbering list)
• маркированный список (as a bulleted list)
• список определений (as a definition list)

Переключатель Создать оглавление для этой страницы? (Would you like a Table of Contents for this page?) содержит два значения. По умолчанию оглавление для страницы не создается. Если хотите создать оглавление, выберите значение Да.

При установленном флажке Использовать таблицы для полей формы (use tables to align form fields) выравнивание полей в форме осуществляется с помощью таблиц. Это более удобный способ выравнивания объектов формы, чем с использованием элементов форматирования, которые могут поддерживаться не всеми обозревателями.

Замечание

Если для выравнивания объектов используются таблицы, то в оформлении формы можно применять любые удобные шрифты.

Завершив установку необходимых параметров, перейдите к следующему шагу в работе мастера, нажав кнопку Далее.

13. Следующее диалоговое окно (рис. 22.6) позволяет указать, где сохранять вводимые в форму данные.

Рис. 22.6. Диалоговое окно для указания того, где сохранять вводимые данные

Установите одну из следующих опций:

• сохранить результаты в виде веб-страницы (save results to a web page)
• сохранить результаты в текстовый файл (save results to a text file)
• использовать специальный сценарий CGI (use custom CGI script)

При выборе первой или второй опции введите имя Web-страницы или текстового файла, соответственно, в поле Введите базовое имя для файла результатов (Enter the base name of the results file).

14. Ввод параметров завершен. Нажмите кнопку Готово (Finish). На экране появляется созданная с помощью мастера форма. Ее можно модифицировать, а затем использовать по назначению.
15. Сохраните созданную страницу формы. Для этого нажмите кнопку Сохранить (Save) на стандартной панели инструментов и в открывшемся диаюго-вом окне Сохранить как (Save As) введите наименование страницы.

На рис. 22.7 показана форма, созданная с помощью рассмотренного нами мастера.

 Рис. 22.7. Форма, созданная с помощью мастера

Редактирование объектов формы и определение их свойств

На рис. 22.7 представлена созданная с помощью мастера форма. Рассмотрим, какого типа объекты в ней размешены и что нужно делать для изменения их свойств, если в том возникнет необходимость.

Текстовые объекты

Форма, как и любая Web-страница, содержит текст. Это — заголовок страницы, сформулированные вами вопросы, надписи к размешенным в форме объектам. Для форматирования текста, размещенного в форме, можно использовать панель инструментов форматирования и параметры диалогового окна Шрифт (Font) аналогично оформлению Web-страницы.

Для облегчения выравнивания объектов, размешенных в форме, можно использовать таблицы. При изменении надписей к полям происходит изменение их ширины. Если надпись находится в ячейке таблицы, то при этом автоматически изменяется размер ячейки. Для изменения размера ячейки можно также использовать мышь. Установите курсор на границу ячейки и, когда он примет вид двунаправленной стрелки, перемещайте в требуемую сторону до получения нужного размера. При размещении полей в столбец друг под другом, изменение размера одной из ячеек влечет за собой изменение всех расположенных под ней ячеек. Для выравнивания размещенных в таблице полей и текста можно использовать кнопки По левому краю (Align Left), По правому краю (Align Right), По ширине (Justify) и По центру (Center) на панели форматирования.

Настройка объектов, размещенных в форме

Помимо текстовой информации, форма содержит объекты, предназначенные для ввода информации. Это — поля ввода, позволяющие вводить данные разных типов, текстовые поля, занимающие несколько строк (в них можно вводить текстовую информацию большого объема), переключатели, флажки, списки. Кроме того, в форме имеются кнопки, которые служат для выполнения определенных действий.

Для настройки объектов формы в программе FrontPage предназначено диалоговое окно свойств объекта. Чтобы его открыть, выполните одно из следующих действий:

• Дважды щелкните на объекте
• Нажмите на настраиваемом объекте правую кнопку мыши и выберите команду Свойства поля формы (Form Field Properties) контекстного меню
• Выделите объект и нажмите комбинацию клавиш <Alt>+<Enter> Рассмотрим более подробно размещенные в форме объекты и их свойства.

Поле ввода

Большинство полей, размещенных в форме с помощью мастера, — это поля ввода. На рис 22.7 полями такого типа являются поля для ввода имени посетителя и адреса URL. Поля данного типа можно использовать в формах для ввода как текстовой, так и числовой информации.

Ширину размещенного в форме поля можно изменить. Для этого выделите его. Затем установите курсор на боковой маркер выделения объекта и, когда он примет вид двунаправленной стрелки, перемещайте вправо для увеличения размера или влево — для уменьшения.

Чтобы установить более точный размер, можно использовать диалоговое окно свойств поля, которое предназначено для настройки его параметров.

Дважды щелкните на поле мышью. Открывается диалоговое окно Свойства текстового поля (Text Box Properties), представленное на рис. 22.8.

Рис. 22.8. Диалоговое окно Свойства текстового поля

Диалоговое окно содержит следующие поля:

• Имя (Name) — наименование поля, используемое при обработке данных, введенных в форму
• Начальное значение (Initial value) — начальное значение поля, отображаемое в нем по умолчанию
• Ширина в знаках (Width in characters) — ширина поля, задаваемая в символах
• Последовательность перехода (Tab order) — порядковый номер поля при перемещении по полям формы с помощью клавиши <Таb>

Замечание

Поле Ширина в знаках (Width in characters) не задает максимальное количество символов, вводимое в поле ввода, а определяет ширину поля в форме. Для определения максимального количества символов, вводимых в поле данных, используется поле Макс, длина (Max Length) диалогового окна Проверка текстового поля (Text Box Validation). Если количество символов, введенное в поле, превышает ширину поля, информация прокручивается.

Переключатель Поле пароля (Password field) позволяет указать, будет ли данное поле использоваться для ввода пароля. Большинство обозревателей в этом поле отображают только символы *, скрывая хранимый в поле текст.

В нижней части диалогового окна находится кнопка Проверить (Validate), при нажатии на которую открывается диалоговое окно Проверка текстового поля (Text Box Validation) (рис. 22.9), позволяющее ввести ограничения на вводимые в это поле данные, чтобы не возникало ошибок при их обработке.

Рис. 22.9. Диалоговое окно Проверка текстового поля

Поле Выводимое имя (Display name) содержит название поля формы, которое будет выводиться на экране для сообщения об ошибке ввода в данное поле. Раскрывающийся список Тип данных (Data type) позволяет указать тип данных, вводимых в поле:

При выборе из раскрывающегося списка Тип данных значения Текст (Text) становятся доступными флажки области Формат текста (Text format), определяющие допустимые для ввода символы:

• буквы (Letters)
• цифры (Digits)
• пробелы (Whitespace)
• другой (Other) — позволяет использовать символы, введенные в поле, расположенное справа от флажка

При выборе из раскрывающегося списка Тип данных значения Число (Number) становятся доступными две группы переключателей. Первый из них, Группировка (Grouping), позволяет задать символы для разделения разрядов числа, а второй — Разделитель (Decimal), — символы для разделения целой и дробной части числа. Установленная опция нет (None) переключателя Группировка указывает на отсутствие разделителей.

Предупреждение

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

Поля Мин. длина (Min length) и Макс, длина (Max Length) области Размер данных (Data length) позволяют указать минимальное и максимальное количество символов, отводимых для ввода данных. Чтобы ввести эти параметры, необходимо предварительно установить флажок Требуется (Required).

Замечание

Если для поля в диалоговом окне Проверка текстового поля установлен флажок Требуется, то вводить в него данные обязательно. Если при вводе информации в форму это поле будет пропущено, то появится сообщение об ошибке с указанием наименования поля.

Параметры области Значение данных (Data value) позволяют указать критерии проверки данных, вводимых в поле . Значение, введенное в поле Значение (Value), используется для сравнения с вводимыми в поле данными, а раскрывающиеся списки содержат значения критерия проверки.

Совет

Если в диалоговом окне Проверка текстового поля вы задали для поля правила проверки допустимости вводимых данных, то расположите в форме рядом с этим полем подсказку, которая поможет пользователю правильно ввести в него информацию.

Поле ввода большой длины

Программа FrontPage позволяет использовать в форме поля для ввода большого объема текстовой информации. Поле данного типа может занимать несколько строк и содержит полосы прокрутки для просмотра не поместившейся в нем информации. Примером такого поля на рис. 22.10 является поле Примечание.

Откройте окно свойств данного объекта формы, дважды щелкнув на нем мышью. На экране откроется диалоговое окно Свойства текстового поля (TextArea Box Properties), представленное на рис. 22.11. Оно аналогично диалоговому окну свойств поля для ввода данных, рассмотренного ранее, но содержит дополнительное поле Число строк (Number of lines), позволяющее указать высоту поля (в строках). Поле Ширина в знаках (Width in characters) указывает ширину поля в символах.

Рис. 22.10. Форма, содержащая поле для ввода большого объема текстовой информации

Рис. 22.11. Диалоговое окно Свойства текстового поля

В нижней части диалогового окна Свойства текстового поля расположена кнопка Проверить (Validate). При ее нажатии открывается диалоговое окно Проверка текстового поля (см. рис. 22.9), аналогичное тому, которое используется для ввода ограничений на вводимые данные поля ввода, рассмотренного выше. Чтобы изменить размеры текстового поля большой длины, можно использовать курсор. Выделите поле. Вокруг него появятся маркеры выделения. Для изменения высоты или ширины поля применяются маркеры, расположенные на соответствующих сторонах. Для изменения одновременно ширины и высоты предназначены маркеры, которые находятся по углам рамки выделения объекта.

Использование флажков в форме

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

 Флажок сброшен

 Флажок установлен

Откройте окно свойств флажка Свойства флажка (Check Box Properties) (рис. 22.12). Оно содержит переключатель Начальное состояние (Initial state), указывающий, в каком состоянии будет находиться флажок при загрузке формы (установленном или сброшенном). По умолчанию установлена опция Снят (Not checked), т. е. в начальном состоянии флажок будет сброшен.

Рис. 22.12. Диалоговое окно Свойства флажка

Переключатель

При проведении опроса среди посетителей Web-узла не стоит заставлять их вводить информацию во множество полей. В этом случае, скорее всего, они опрос просто проигнорируют. Чтобы узнать мнение посетителя по тому или иному вопросу, не заставляя вводить информацию, удобно в форме использовать переключатели, содержащие опции с вариантами предполагаемых ответов. В этом случае требуется минимальное время на ввод информации. Посетитель просматривает предложенные вами варианты ответов и выбирает нужный, установив соответствующую опцию. Переключатель является составным объектом, так как в него входит несколько опции. Для настройки свойств переключателя используются диалоговые окна Свойства переключателя (Option Button Properties) каждой опции, из входящих в его состав. Вил этого диалогового окна показан на рис. 22.13.

Рис. 22.13. Диалоговое окно Свойства переключателя

Поле Имя группы (Group name) содержит групповое имя опций переключателя. Оно должно быть одинаковым для всех опций, входящих в состав данного переключателя.

Поле Значение (Value) содержит значение, которое будет использоваться при установке данной опции.

Переключатель Начальное состояние (Initial stale) диалогового окна Свойства переключателя указывает, будет ли установлена данная опция по умолчанию при загрузке формы.

Замечание

В переключателе, размещенном в форме, одна из опций (наиболее вероятный вариант ответа) должна иметь в диалоговом окне Свойства переключателя установленное значение Выбран (Selected), а остальные— Не выбран (Not selected).

Списки

Списки, разметаемые в форме, так же, как и переключатели, избавляют посетителей Web-узла от ввода информации, позволяя выбрать предпочтительный ответ из предложенных вариантов.

Для настройки свойств списка используется диалоговое окно Свойства раскрывающегося списка, показанное на рис. 22.14.

В поле Имя (Name) отображается имя списка. В расположенной под этим полем области содержатся элементы списка.

Рис. 22.14. Диалоговое окно Свойства раскрывающегося списка

Кнопки, находящиеся справа в диалоговом окне, позволяют добавлять в список новые элементы, модифицировать существующие, изменять порядок следования элементов списка:

Поле Высота (Height), расположенное в нижней части диалогового окна Свойства раскрывающегося списка, позволяет задать высоту списка в обозревателе. При вводе в это поле значения 1 получается список, называемый раскрывающимся. В нем виден только первый элемент списка. Для открытия всего списка используется кнопка со стрелкой, расположенная с правой стороны поля. При вводе в поле Высота значения, большего 1, становятся видны несколько элементов списка, количество которых определяется введенным числом. Для просмотра всего списка используется располагаемая в нем полоса прокрутки.

Ширина списка устанавливается автоматически и определяется длиной самого длинного элемента списка. Переключатель Разрешен выбор нескольких элементов (Allow multiple selections) определяет, разрешить ли выбор из списка нескольких значений. По умолчанию установлена опция Нет. Значение Да удобно использовать, например, в том случае, если вы предлагаете для продажи список товаров, и покупатель может выбрать более одного вида товара.

Для ввода в список нового элемента нажмите кнопку Добавить (Add). Открывается диалоговое окно Добавление варианта (Add Choice), показанное на рис. 22.15. Введите в поле Вариант (Choice) наименование элемента. Для ввода значения, присваиваемого элементу списка (по умолчанию оно совпадает с наименованием элемента), установите флажок Значение (Specify Value) и введите в расположенное под ним поле требуемое значение.

Рис. 22.15. Диалоговое окно Добавление варианта, предназначенное для добавления нового элемента в список

По умолчанию при просмотре списка в обозревателе курсор установлен на его первом элементе. Если вы хотите, чтобы сразу выбирался добавляемый вами элемент, установите для него в диалоговом окне Добавление варианта опцию выбрано (Selected). При этом будет автоматически снята данная опция для остальных элементов списка.

В нижней части диалогового окна Свойства раскрывающегося списка размещена кнопка Проверить (Validate), при нажатии которой открывается диалоговое окно Проверка раскрывающегося списка (Drop-Down Box Validation) (рис. 22.16).

Рис. 22.16. Диалоговое окно Проверка раскрывающегося списка

Если вы хотите, чтобы пользователь обязательно выбирал из списка какой-либо элемент, установите флажок Данные обязательны (Data Required).

Флажок Запретить выбор первого элемента (Disallow Hist choice) не разрешает выбирать пользователю первым пункт списка. Данный флажок устанавливают в том случае, кона первый пункт списка — это рекомендация или замечание.

Кнопки управления

Кнопки, размещаемые в форме, позволяют выполнять заданное действие. Посмотрите на форму, созданную мастером. В ее нижнем части расположены две кнопки: Отправить (Submit Form) и Сброс (Reset Form). Кнопка Отправить предназначена для пересылки введенных в форму данных обработчику на Web-сервер. Кнопка Сброс возвращает форму в исходное состояние. при котором можно приступить к вводу данных. Дважды щелкните мышью на кнопке Отправить. Открывается диалоговое окно Свойства кнопки (Push Button Properties), показанное на рис. 22.17.

Рис. 22.17. Диалоговое окно Свойства кнопки

Поле Имя (Name) предназначено для ввода имени объекта. Расположенное под ним поле Значение или подпись (Value/label) используется для ввода текста, который будет отображаться на кнопке. Иными словами, это наименование кнопки.

Переключатель Тип кнопки (Button type) позволяет задать действие, выполняемое при нажатии кнопки, и содержит следующие опции:

• Обычная (Normal) — используется в том случае, если при нажатии кнопки выполняется скрипт (сценарий), созданный разработчиком
• Отправить (Submit) — введенные в форму данные передаются обработчику на Web-сервер
• Сброс (Reset) — поля формы сбрасываются в исходное состояние

Свойства формы

Мы рассмотрели свойства всех объектов, разметаемых в форме и предназначенных для ввода информации. Кроме того, сама форма имеет окно свойств Свойства формы (рис. 22.18), позволяющее указать, где сохранять введенные в форму данные или какие обработчики использовать для них, а также настроить другие параметры формы.

Для открытия диалогового окна Свойства формы (Form Properties) выполните одно из следующих действий:

• Установите курсор в свободное от объектов место формы, нажмите правую кнопку мыши и выберите команду Свойства формы контекстного меню
• В меню Вставка (Insert) выберите команду Форма (Form), а затем — опцию Свойства формы (Form Properties)

Рис. 22.18. Диалоговое окно Свойства формы

Диалоговое окно Свойства формы разделено на две области. Верхняя область Сохранение результатов (Where to store results) позволяет указать, где будут храниться данные, введенные в форму. В ней находятся следующие три опции:

• Отправка (Send to) — при использовании этой опции данные можно сохранять в Web-странице или в текстовом файле, расположение и наименование которых вводятся в поле Имя файла (File name), а также направлять их электронной почтой по адресу, указанному в поле Адрес почты (E-mail address)
• В базе данных (Send to database) — данные из формы сохраняются в повой или существующей базе данных Microsoft Access

Замечание

Для использования этой опции вы предварительно должны установить на Web-сервере FrontPage Server Extensions.

• В другом месте (Send to other) — данные из формы направляются одному из трех обработчиков, задаваемых в расположенном рядом списке. Список содержит следующие элементы: Настраиваемый сценарий ISAPI, NSAPI, CGI или ASP (Custom ISAPI, NSAPI, CGI or ASP script ), Обработчик формы регистрации (Registration Form Handler), Обработчик формы обсуждения (Discussion Form Handler)

Замечание

Скрипты ISAPI, NSAPI, CGI и ASP являются программными компонентами, размещенными на Web-сервере и предназначенными для обработки данных, получаемых из формы.

Одноименная область диалогового окна Свойства формы (Form Properties) содержит два поля. Поле Имя формы (Form name) содержит имя формы, которое может быть использовано обработчиком. Поле Конечная рамка (Target frame) позволяет указать конечный фрейм, в котором будут отображаться данные из формы.

В нижней части диалогового окна Свойства формы расположена кнопка Параметры (Options), открывающая диалоговое окно Сохранение результатов (Saving Results), показанное на рис. 22.19. Оно содержит 4 вкладки. Рассмотрим параметры, настраиваемые с помощью этого окна.

Рис. 22.19. Диалоговое окно Сохранение результатов

Вкладка Результаты в файле

Вкладка Результаты в файле (File Results) диалогового окна Сохранение результатов (Saving Results), представленная на рис. 22.19, позволяет задать параметры файла, в который записываются данные, введенные в форму.

В верхней части вкладки размешено поле Имя файла (File name), позволяющее указать наименование Web-страницы или текстового файла, в которых данные сохраняются, и их расположение. Чтобы легче было вводить информацию в это поле, можно использовать кнопку Обзор (Browse) и открываемое ею диалоговое окно Текущий веб-узел (Current Web).

Замечание

Если указанный в этом поле файл не существует, при сохранении данных он будет создан программой FrontPage.

Раскрывающийся список Формат файла (File format) и расположенные под ним флажки Включить имена полей (Include field names) и Последние результаты в конце (Latest results at end) определяют формат файла и вид отображения размещенных в нем данных.

Используя список Формат файла, можно задать форматы файла, представленные в табл. 22.2.

Таблица 22.2. Доступные форматы для файла, содержащего данные, введенные в форму

Установленный флажок Включить имена полей (Include field names) указывает на необходимость включения в файл не только данных, вводимых в форму, но и названия полей.

При установке флажка Последние результаты в конце (Latest results at end) добавляемая информация размещается в конце файла.

Замечание

Флажок Последние результаты в конце доступен только для файлов в формате HTML. Для остальных четырех форматов данные всегда добавляются в конец файла.

Параметры области Дополнительный файл (Optional second file) аналогичны параметрам, размещенным в верхней части вкладки, и используются в том случае, если вы хотите записывать данные параллельно в два различных файла.

Вкладка Отправка результатов по почте

Вкладка Отправка результатов по почте (E-mail Results) диалогового окна Сохранение результатов (Saving Results), представленная на рис. 22.20, позволяет задать параметры, используемые для передачи по электронной почте данных, которые были введены в форму.

В верхней части вкладки размещено поле Адрес для получения результатов (E-mail address to receive results), позволяющее указать электронный адрес, по которому будут отправляться введенные в форму данные.

Раскрывающийся список Формат электронной почты (E-mail format) содержит форматы, аналогичные содержащимся в табл. 22.2. По умолчанию установлено значение Форматированный текст (Formatted text), так как этот формат распознается большинством распространенных почтовых программ.

Установленный флажок Включить имена полей (Include field names) указывает на необходимость включения в почтовое сообщение не только данных, вводимых в форму, но и названия нолей.

Рис. 22.20. Вкладка Отправка результатов по почте диалогового окна Сохранение результатов

Область Заголовок сообщения (E-mail message header) содержит два поля следующего назначения:

• Строка темы (Subject line) — предназначено для ввода темы почтового сообщения. При установке флажка Имя поля формы (Form field name), расположенного над этим полем, темой сообщения будет служить знамение поля формы, введенного в Строка темы
• Строка отправителя (Reply-to line) — обратный адрес почтового сообщения. При установке флажка Имя поля формы (Form field name), расположенного над этим полем, обратным адресом будет служить значение поля формы, введенного в Строка отправителя

Совет

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

Вкладка Страница подтверждения

Вкладка Страница подтверждения (Confirmation Page) диалогового окна Сохранение результатов (Saving Results), представленная на рис. 22.21, позволяет задать параметры, используемые для настройки формы подтверждения. Вкладка содержит для поля:

• URL-адрес страницы подтверждения (URL of confirmation page) — используется для указания адреса страницы подтверждения, в которой будут отображаться данные, введенные в форму, чтобы пользователь мог их проверить.

Рис. 22.21. Вкладка Страница подтверждения

• URL-адрес страницы сбоя проверки (URL of validation failure page) — предназначена для указания адреса страницы, в которую будет записываться информация при возникновении ошибок ввода данных в форму

Замечание

Поле URL-адрес страницы сбоя проверки доступно только в том случае, если для какого-либо из полей формы заданы условия проверки вводимых данных.

Вкладка Сохраняемые поля

Вкладка Сохраняемые поля (Saved Fields) диалогового окна Сохранение результатов (Saving Results), представленная на рис. 22.22, содержит список всех полей формы, предлагая сохранить порядок их расположения. Вы можете задать иной порядок.

Раскрывающиеся списки области Дата и время (Date and time) позволяют включить в формируемый файл дату и время заполнения формы в любом из предложенных форматов. Область Дополнительные сохраняемые сведения (Additional information to save) содержит три флажка, перечисленных ниже, при установке которых в файл будет включена следующая информация:

• имя удаленного компьютера (Remote computer name) — имя удаленного компьютера, с которого заполнялась форма
• имя пользователя (Username) — имя пользователя, заполнявшего форму
• тип обозревателя (Browser type) — тип обозревателя, в котором форма просматривалась и заполнялась

Рис. 22.22. Вкладка Сохраняемые поля диалогового окна Сохранение результатов

Настройка пользовательских обработчиков

При использовании в Web-узле обработчиков ISAPI, NSAP1, CG1 или ASP для настройки их свойств используется диалоговое окно Параметры обработчика форм (Options for Custom Form Handler).

Для открытия диалогового окна Параметры обработчика форм выполните следующие действия:

1. Откройте диалоговое окно свойств формы Свойства форм (Form Properties), выбрав в контекстном меню одноименную команду.
2. В области Сохранение результатов (Where to store results) установите опцию В другом месте (Send to other). В расположенном справа списке по умолчанию установлено значение Настраиваемый сценарий ISAPI, NSAPI, CGI или ASP (Custom ISAPI, NSAPI, CGI or ASP script ). Оставьте это значение.
3. Нажмите кнопку Параметры (Options), расположенную в нижней части окна.

Поле Действие (Action) диалогового окна предназначено для ввода URL адреса обработчика формы.

Раскрывающийся список Метод (Method) позволяет указать метод передачи данных обработчику и содержит два значения:

• POST — при использовании этого метода данные из формы парами, состоящими из наименовании поля и его значения, поступают непосредственно на вход обработчика
• GET — данные из формы парами, состоящими из наименования поля и его значения, кодируются, а затем присваиваются переменной query_string

По умолчанию предполагается, что при кодировании данных формы, передаваемых обработчику, используется метод appiication/x-www-form-urlencoded. Если вы хотите использовать иной метод кодирования, введите его название в поле Тип кодировки (Encoding type).

Завершив в диалоговом окне Параметры обработчика форм (Options for Custom Form Handler) ввод всех параметров, нажмите кнопку ОК.

Самостоятельная разработка формы

Мы описали процесс создания формы с помощью мастера, познакомились с объектами формы и их свойствами. Прежде чем приступить к самостоятельной разработке формы, рассмотрим инструменты, с помощью которых можно размешать в ней объекты.

Инструменты, используемые для размещения в форме объектов

Для размещения в форме объектов используются команды (рис. 22.23), появляющиеся при выборе из меню Вставка (Insert) команды Форма (Form). Назначение этих команд описано в табл. 22.3.

Рис. 22.23. Команды, используемые для создания формы

Таблица 22.3. Команды меню Форма

Разработка формы

Рассмотрим создание формы, в которой разместим по возможности большинство предлагаемых программой FrontPage объектов. После создания форма будет иметь вид, показанный на рис. 22.24.

1. Откройте Web-узел, в который хотите вставить страницу формы.
2. Добавьте в него страницу, имеющую шаблон Обычная страница (Normal Page).
3. Введите в верхней части новой Web-страницы заголовок Форма опроса посетителей Web-узла.
4. Чтобы разместить в форме поле для ввода фамилии посетителя, установите курсор на следующую после заголовка строку и в меню Вставка (Insert) выберите команду Форма (Form), а затем — опцию Поле (Textbox). На странице появляется пунктирный контур, определяющий область формы. Внутри контура расположено поле ввода и две кнопки Отправить (Submit) и Сброс (Reset) (рис. 22.25). Кнопка Отправить позволяет отправить обработчику введенные в форме данные, а кнопка Сброс переводит форму в исходное состояние.
5. Увеличьте область формы, чтобы в ней можно было разместить все необходимые объекты. Для этого установите курсор между полем и кнопками и несколько раз нажмите клавишу <Enter>.

Рис. 22.24. Созданная форма

Рис. 22.25. Область для создания формы после размещения на Web-странице первого поля

6. Введите в верхней части формы текст Введите, пожалуйста, о себе следующую информацию:.
7. Для выравнивания объектов формы удобно использовать таблицу. Создайте в верхней части формы таблицу, состоящую из двух строк и двух столбцов.
8. Перенесите поле ввода, размещенное в форме, во вторую ячейку первой строки таблицы. Для этого установите на поле курсор, нажмите кнопку мыши и, удерживая ее нажатой, перенесите поле в требуемое место. Затем отпустите кнопку мыши.
9. Для открытия окна свойств поля дважды щелкните на нем мышью.
10. В поле Имя (Name) открывшегося диалогового окна Свойства текстового поля (Text Box Properties) введите наименование поля Lastname. Задайте также ширину поля, предназначенного для ввода фамилии, введя 25 в поле Ширина в знаках (Width in characters). Нажмте кнопку OK для закрытия диалогового окна.
11. В первой ячейке первой строки таблицы введите начнись к полю Фамилия.
12. В первом ячейке второй строки введите надпись ко второму полю Возраст.
13. Для создания поля, позволяющего вводить возраст посетителя, установите курсор во вторую ячейку второй строки таблицы и выберите в меню Вставка (Insert) команду Форма (Form), а затем — опцию Поле (Textbox).
14. Чтобы настроить свойства созданного поля, дважды щелкните на нем мышью.
15. В поле Имя (Name) открывшегося диалогового окна Свойства текстового поля (Text Box Properties) введите наименование поля Age, а в поле Ширина в знаках (Width in characters) цифру 3, определяющую ширину ноля в символах.
16. Для настройки параметров, вводимых в поле данных, в диалоговом окне Свойства текстового поля нажмите кнопку Проверить (Validate). Так как в поле будут вводиться только целые числа, в списке Тип данных (Data type) открывшегося диалогового окна Проверка текстового поля (Text Box Validation) (см. рис. 22.9) выберите значение Целое (Integer). Установите флажок Требуется (Required) и в поля Мин. длина (Min length) и Макс, длина (Max length) введите цифры 1 и 3, определяющие минимальное и максимальное количество символов, отводимых для ввода возраста посетителя. Завершив настройку параметров поля, нажмите кнопку ОК.
17. Теперь разместим в форме переключатель, содержащий две опции, с помощью которых посетитель сможет указать свой пол. Для этого установите курсор в строку, находящуюся ниже таблицы, и выберите в меню Вставка (Insert) команду Форма (Form), а затем — опцию Переключатель (Option Button).
18. Откройте окно свойств опции Свойства переключателя (Option Button Properties).
19. В поле Имя группы (Group name) введите наименование группы опций M_W, а в поле Значение (Value) — значение опции Мужской. Нажмите кнопку ОК для закрытия диалогового окна.
20. Введите с правой стороны созданной опции надпись к полю: Мужской.
21. Сделайте несколько пробелов и разместите рядом с первой опцией вторую.
22. В окне свойств опции введите наименование группы M_W, а в поле Значение (Value) — значение опции Женский.
23. С правой стороны опции введите надпись к полю Женский.
24. Установите курсор в следующую строку и введите текст Что Вам понравилось в нашем Web-узле?
25. Разместим теперь под текстом список, с помощью которого попытаемся узнать у посетителя, что ему понравилось в нашем Web-узле. Установите курсор в место предполагаемого размещения списка и выберите в меню Вставка (Insert) команду Форма (Form), а затем — опцию Раскрывающийся список (Drop-Down Box).
26. Дважды щелкните на созданном объекте. Откроется диалоговое окно Свойства раскрывающегося списка (Drop-Down Box Properties). В поле Имя (Name) введите наименование списка. Используя кнопку Добавить (Add) и открываемое ее диалоговое окно, сформируйте список возможных вариантов ответа. Установите опцию Да переключателя Разрешен выбор нескольких элементов (Allow multiple selections), чтобы разрешить пользователю выбрать из списка несколько значений. Чтобы все элементы списка были видны, введите в поле Высота (Height) число 4. Диалоговое окно Свойства раскрывающегося списка с установленными параметрами показано на рис. 22.26. Закройте диалоговое окно, нажав кнопку ОК.

Рис. 22.26. Диалоговое окно Свойства раскрывающегося списка, в котором установлены необходимые параметры

Совет

Для настройки шрифта, используемого в оформлении списка, можно воспользоваться диалоговым окном, открываемым при нажатии кнопки Стиль (Style).

27. Разместим рядом со списком поле ввода большой длины. Вдруг пользователь захочет свои впечатления о Web-узле или пожелания ввести в произвольной форме. Для размещения поля данного типа в форме выберите в меню Вставка (Insert) команду Форма (Form), а затем — огшию Текстовое поле (Text Area).
28. Откройте окно свойств Свойства текстового поля (TextArea Box Properties) созданного объекта.
29. В поле Имя (Name) введите наименование поля Comment. В поле Ширина в знаках (Width in characters) укажите ширину поля в символах, введя число 20, а в поле Число строк (Number of lines), позволяющее указать высоту поля в строках, — число 4. Закройте диалоговое окно, нажав кнопку ОК.
30. Все объекты размешены в форме. Откройте диалоговое окно свойств формы. Для этого в меню Вставка (Insert) выберите команду Форма (Form), а затем значение Свойства формы (Form Properties).
31. По умолчанию в диалоговом окне Свойства формы установлена опция Отправка (Send to), а в поле Имя файла (File name) указан текстовый файл, сохраняемый в папке private Web-узла. Посмотрите имя файла, чтобы знать, где искать введенные в форму данные.
32. Нажмите кнопку Параметры (Options). Открывается диалоговое окно Сохранение результатов. На вкладке Результаты в файле (File Results) в списке Формат файла (File format) выбрано значение Текстовый (разделитель — запятая) (Text database using comma as a separator). Если требуется, измените формат данных, записываемых в текстовый файл.
33. Для размещения в файле даты заполнения формы откройте вкладку Сохраняемые поля (Saved Fields) диалогового окна Сохранение результатов (Saving Results) и, используя список Формат даты (Date Format), выберите устраивающий вас формат даты.
34. Нажмите кнопку ОК для закрытия диалогового окна свойств формы.
35. Сохраните Web-страницу, содержащую форму. Создание формы завершено.

Добавить в избранное  ||  Использование компонентов  ||  Введение  ||  Приложение Установка программы FrontPage

top

Школа Майкрософт© Copyright 2007г.

графика, хтмл, для, начинающий, начинающих, чайников, новичков, просто, основа, основы, графика, страница, домашний, домашняя, сайт, новый, новичок, html, обучение, учеба, пример, веб, мастер, веб-мастер, дизайн, веб-дизайн, вебдизайн, дезайн, веб-дезайн, вебдезайн, дезайнер, дизайнер, ступени, тэги, тэг, теги, тег, аттрибут, атрибуты, парамет, design, web, help, помощь, icq, e-mail, guest, book, guestbook, гостевая, книга, форум, аська, контакт, ссылка, link, links, banner, обмен, баннер, баннерами, банер, baner, друзья, friends, почитать, написать, вопросы, вопрос, ответ, проект, ступени, словарь, excel, exel, excell, exsel, эксель, ексель, для, начала, сначала, таблицы, форматирование, ряды, строки, ячейка, начинающий, начинающих, чайников, новичков, просто, основа, основы