Практическое занятие №10

Наименование: Создание анкеты на основе форм

1. Цель: Научится использовать различные виды форм на веб - страницах

2. Подготовка к занятию: по предложенной литературе повторить тему «Конструирование форм» и ответить на следующие вопросы:

2.1 Перечислите основные теги организации форм?

2.2 Какие атрибуты и значения принимает тег <INPUT>?

2.3 Как организуется текстовое поля для сбора комментариев от посетителей сайта?

3. Литература:

3.1 Шомас Е.А. Конспект лекций по дисциплине «Веб - дизайн»

3.2 Шомас Е.А., Программное обеспечение компьютерных сетей, учебно – методическое пособие, гриф УМЦ 2010

3.3 Клименко Р.А. Веб-мастеринг на 100%. – СПб.: Питер, 2013. – 512 с.

4. Перечень оборудования и программного обеспечения:

4.1 ПЭВМ, подключенные к сети Интернет

4.2 Браузеры

4.3 Текстовый редактор

5. Задание:

5.1 В строке заголовка должен отражаться номер практической работы

5.2 В теле документа создайте заголовок первого уровня, где укажите наименование работы. Заголовком второго уровня – цель работы.

5.3 Создайте форму заявки на участие в конференции по следующему образцу:

5.4 В любом месте добавьте элементы формы в виде логина и пароля

6. Порядок выполнения работы:

6.1 По предложенной литературе изучить необходимый материал и ответить на вопросы для допуска к практическому занятию;

6.2 Выполнить задание практического занятия;

6.3 Дать ответы на контрольные вопросы;

7. Содержание отчета:

7.1 Наименование и цель работы

7.2 Код программы

7.3 Ответы на контрольные вопросы

7.4 Вывод о проделанной работе

8. Контрольные вопросы:

8.1 Назначение форм при создании сайта?

8.2 Основные виды форм?

8.3 В чем отличие кнопки – переключателя и кнопки - флажка?

ПРИЛОЖЕНИЕ:

Форма – это набор таких знакомых нам по диалоговым окнам элементов, как поля ввода, поля выбора, переключатели. Форма – это то, что позволяет создавать интерактивные страницы, т.е. организовывать диалог с пользователем.

<FORM> …</FORM>

Этот тег используется для создания заполняемых форм. Между <FORM> и </FORM> можно использовать тэги для создания полей нескольких типов (текстовые поля в одну или несколько строк, группы радиокнопок (их еще называют переключателями), окошки, в которые можно устанавливать флажки, меню, командные кнопки).

Содержание формы - это теги для сбора данных (они всегда используются вместе с атрибутами):
< INPUT > - это тег для сбора информации от посетителей ваших страниц и её сохранения для последующей обработки.
NAME =".." - это атрибут - метка, для обработки собранных данных механизмом CGI.
TYPE =".." - это атрибут, который указывает на способ обработки собранных данных.
Атрибуты NAME и TYPE используются совместно с тегом INPUT

<FORM ACTION="URL">
<INPUT NAME="метка 1">
<INPUT TYPE="submit">
Остальная часть формы...
</FORM>

Способов приёма и обработки данных всего несколько видов - это 9 различных атрибутов для тега INPUT:
1. TYPE="text" - текстовая строка.
2. TYPE="password" - ввод пароля.
3. TYPE="radio" - кнопка-переключатель.
4. TYPE="checkbox" - флажок.
5. TYPE="Submit" - кнопка отправки данных.
6. TYPE="Reset" - кнопка сброса данных.
7. TYPE="Button" - кнопка для других целей.
8. TYPE="file" - выбор файла.
9. TYPE="hidden" - невидимый посетителям обработчик данных,
а также 3 парных тэга:
1. <SELECT></SELECT> - Ваш Выбор Мой выбор Их выбор Нет выбора! раскрывающееся меню

2. <SELECT MULTIPLE></SELECT> - Превое Второе Третье И т.д. список
3. <TEXTAREA></TEXTAREA> - текстовое поле
Это текстовое поле может служить для сбора комментариев посетителей, или же в этом поле можно оставлять дополнительные сведения, коды, или любую другую информацию...

Не нашли, что искали? Воспользуйтесь поиском: