При создании форм на сайте фантазия отдана в руки вебмастера. Для чего же существуют формы? На этот вопрос ответ может найти каждый, ведь многие кто уже не первый день в сети посещали сайты различных тематик и не раз сталкивались с тем, что нужно зарегистрироваться на сайте, подписаться на рассылку или задать вопросы на форуме сайта, связаться с администрацией напрямую через форму сайта, а так же ответить на вопросы какого-либо социологического опроса. Во всех этих случаях как раз то и применяются так называемые формы или скрипты форм, после заполнения которых результат обрабатывается и передается назначенному адресату.
Давайте разберем простейший пример создания формы на сайте, для отправки сообщений администратору сайта (то есть в данном случае Вам) на Ваш электронный адрес, который будет указан в коде сайта.
На страничке сайта cod.html, открыв просмотр HTML-кода под ненумерованным списком между закрывающими тегами </ul> и </body> напишем текст «Сообщение администратору сайта», который заключим в теги <p align=center></p>
align=center – атрибут выровняет текст сообщения по центру страницы.
Для получения формы используются теги:
<form></form>
На одной и той же страничке может находится несколько форм сколько позволит её размер, но эти формы не должны располагаться одна в другой, а вот простой текст и другие теги могут находится в форме без ограничения.
Тег <form> должен обязательно содержать атрибут action, который будет указывать местоположение программы обработчика или адрес сервера в сети обрабатывающего данную заполненную форму. В этом случае сообщение посетителя должно уйти на Ваш электронный адрес (e-mail), значить атрибуту action стоит присвоить название электронной почты:
action="mailto:имя почтового @mail.ru"
Для задания протокола или каким образом будут передаваться данные из формы программе, применяется дополнительный атрибут тега <form>
method
Так как для отправки запроса будет использоваться электронная почта, то атрибуту присваивается значение – post, и в итоге код примет вид:
<form action="mailto:имя почтового @mail.ru" method=post></form>
Теперь откроем уже ранее созданную страничку cod.html и вставим этот код перед закрывающим тегом </body> тела документа, присвоив при этом атрибуту action имя своего электронного адреса (почты), если таковое имеется.
Чтобы было где писать посетителю сообщения, нужно создать многострочное окно с чистым полем, для этого применяются теги
<textarea></textarea >
Для того чтобы хоть как то задать размер поля под написание текстового сообщения, открывающему тегу присваиваются следующие атрибуты:
rows – количество строк
cols – количество колонок
name – имя под которым написанное сообщение из формы будет передано программе обработчику.
Посмотрим, что должно получиться на примере:
<textarea rows=10 cols=50 name=comments ></textarea >
Код создает форму ввода высотой в 10 строчек и шириной 50 символов включая пробелы, и будет отправлен обработчику с именем comments, то есть комментарии. Вставим данный код в строчку HTML документа перед закрывающим тегом </form> файла cod.html, сохраним изменения и посмотрим получившийся результат:
<html>
<head>
<title>Содержание</title>
</head>
<body>
<h3 align=center>Содержание</h3>
<ul>
<li>Введение.
<li>Создание сайта.
<li>Раскрутка сайта.
<li>Администратирование сайта.
<li>Антивирусная защита.
</ul>
<form action="mailto:имя почтового @mail.ru" method=post>
<textarea rows=10 cols=50 name=comments ></textarea >
</form>
</body>
</html>
Давайте разберемся, как же посетитель сайта будет отправлять свое сообщение, ведь само собой оно же не уйдет. Значит необходимо создать управляющий элемент, обычно это обыкновенная кнопка, которая располагается рядом с формой написания текста. Кнопка для формы делается очень просто, с помощью одиночного тега <input> с атрибутом type, которому присваивается значение submit,что означает передача данных.
<input type=submit>
Если вы хотите задать кнопке для формы, какое-либо свое имя то примените для этого атрибут valuе с названием кнопки, которое Вы укажете, если название кнопки для формы будет на языке отличным от латинского, то обязательно заключите его в кавычки, например: «Отправить»
<input type=submit valuе=«Отправить»>
<html>
<head>
<title>Содержание</title>
</head>
<body>
<h3 align=center>Содержание</h3>
<ul>
<li>Введение.
<li>Создание сайта.
<li>Раскрутка сайта.
<li>Администратирование сайта.
<li>Антивирусная защита.
</ul>
<form action="mailto:имя почтового @mail.ru" method=post>
<textarea rows=10 cols=50 name=comments ></textarea >
<p><input type=submit valuе=«Отправить»></p>
</form>
</body>
</html>
Сохраняем внесенные изменения в файле cod.html и если есть соединение с интернетом можно проверить, получилось ли у Вас сделать форму на сайте правильно. Для этого откройте файл cod.html с измененным кодом и напишите в чистом поле формы какое-либо сообщение. Нажимаем кнопку "Отправить" под формой, после нажатия кнопки на экране монитора скорее всего появится предупреждающее сообщение, что Ваш e-mail будет передан получателю, то есть владельцу сайта, нажимаем «ОК». Если всё сделано правильно, то в скором времени на свой почтовый ящик получите сообщение, которое было введено в созданную форму.
