Давайте создадим для HTMLформы страницу, где пользователи будут фикси
ровать свое имя, фамилию, адрес электронной почты и давать произвольный
комментарий. Для этого в экранной форме нужно создать необходимые поля
и соответствующие им переменные.
Создание HTMLформы
- Откройте текстовый редактор и создайте новый документ.
<HTMLxHEADxTITLE>HTML Form</TITLEx/HEAD><BODYx/BODY></HTML>
- В тело программы добавьте открывающий и закрывающий тэги для экран
ной формы (листинг 3.1).
<FORM ACTION="HandleForm.php"> </FORM>.
- Сохраните страницу как form.html.
- Вставьте курсор между тэгами <FORM> и нажмите клавишу Enter для созда
ния новой строки. - Теперь начнем добавлять в форму поля:
- На отдельной строке напечатайте новую строку
- Сохраните сценарий (листинг 3.2), загрузите его на сервер и просмотри
те в окне браузера (рис). Так как это обычная страница, а не PHPсце
нарий, ее можно увидеть и без сервера, в окне браузера прямо на вашем
компьютере.
Тэги <FORM> задают начало и конец формы. Все элементы формы должны
быть размещены между ними. Атрибут ACTION сообщает серверу, какая страни
ца (или сценарий) получит данные из формы.
Листинг 3.1 т Каждая HTMLформа начинается и заканчивается тэгами
<FORM> и </FORM>. He забывайте использовать их. Также помните, что необхо
димо отправлять форму для обработки в соответствующий сценарий с помо
щью атрибута ACTION.
1. <HTML>
2. <HEAD>
3. <TITLE>HTML Form</TITLE>
4. </HEAD>
5. <BODY>
6. <PORM ACTION = "HandlePorm.php">
7. </PORM>
8. </BODY>
9. </HTML>
First Name <INPUT TYPE=TEXT NAME=”FirstName” SIZE=20xBR>
Будьте последовательны и присвойте каждому полю в форме логическое
и наглядное имя. Для имени используются буквы, числа и символ подчеркива
ния (_). При работе внимательно следите за именами полей.
Last Name <INPUT TYPE=TEXT NAME="LastName" SI2E=40xBR>
Добавьте тэги <BR>, чтобы форма выглядела более аккуратно в окне браузера.
Email Address <INPUT TYPE=TEXT NAME="Email" SIZE=60xBR>
Comments <TEXTAREA NAME ="Comments" ROWS=5 COLS=40x/TEXTAREAxBR>
Текстовая область предоставляет пользователю больше места для ввода ком
ментариев, чем текстовое поле. Однако в последнем можно ввести ограниче
ние на количество вводимых символов, в то время как в текстовой области это
сделать невозможно. При создании формы выбирайте тот тип поля, который
более соответствует информации, вводимой пользователем.
<INPUT TYPE=SUBMIT NAME="SUBMIT" VALUE="Submit!">
Значение типа SUBMIT это надпись на кнопке в окне браузера. Также мож
но использовать кнопки Go! или Enter.
Листинг 3.2 т Разрешается использовать любую комбинацию полей ввода
в форме, главное, чтобы все они были определены внутри тэгов <FORM>, иначе
не будут работать. Представленная в виде таблицы форма удобна в использова
нии и выглядит профессионально.
1. <HTML>
2. <HEAD>
3. <TITLE>HTML Fbrm</TITLE>
4. </HEAD>
5. <BODY>
6. <FORM ACTION="HandleForm.php"> ' •
7. First Name <INPDT TYPE=TEXT NAME="FirstNaae" SIZE=20xBR>
8. Last Name <INPUT TYPE=TEXT NAME="LastName" SIZE=40xBR>
9. Email Address <INPTJT TYPE=TEXT NAME="Email" SIZE=60xBR>
10. Comments <TEXTAREA NAME= "Comments" ROWS=5 COLS=40x/TEXTAREAxBR>
11. <INPUT TYPE=SOBMIT NAME="SUBMIT" VALUE="Submit!">
12. </FORM>
13. </BODY>
14. </HTML>
В данном примере мы создали форму, вручную написав HTMLкод. Можно делать
то же самое в специальных HTMLредакторах, таких как Dreamweaver или GoLive,
если вам это больше нравится.
Мы использовали стандартное расширение HTML (.html), так как создавали обыч
ную HTMLстраницу. Можно было применить расширение .php и получить тот же ре
зультат, хотя сам язык и не был бы использован. Напоминаю, что на РНРстранице
все, что не ограничено PHPтэгами <?php и ?>, трактуется как обычный код HTML
Хотя мы и не рассматривали этот вопрос, я все же порекомендовал бы использо
вать в формах, особенно сложных, кнопку Reset. Создать ее можно следующим
образом:
<INPUT TYPE=RESET NAME=RESET VALUE="RESET">
Убедитесь, что атрибут ACTION правильно указывает на существующий на серве
ре файл, иначе форма не будет обработана. В нашем случае мы определяем, что
файл HandleForm.php находится в одном каталоге со страницей form.html.