Веб-дизайн и поисковая оптимизация

Создание формы обратной связи

• Создание формы обратной связи на сайте
• Проверка ввода формы обратной связи
• Простая форма обратной связи с проверкой введенных данных
• Создание анкеты на сайте
• Проверка формы обратной связи "на лету"
• Отправка файлов через форму обратной связи
• Капча в форме обратной связи
• Простая капча для формы обратной связи
• Заказ товаров и услуг через форму обратной связи
• Форма обратной связи - отправка писем на разные адреса
• Проблемы с кодировкой в форме обратной связи
• Создание кнопок в форме обратной связи
• Календарь в форме обратной связи
• Оформление формы обратной связи
        >> смотреть все статьи о создании формы обратной связи

Исправление ошибок при заполнении формы обратной связи

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

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

Для примера, создадим обычную форму обратной связи:

Фамилия:

Имя:

Отчество:

Ваш адрес:

HTML-код такой формы не имеет каких-либо особенностей (см. статью "Создание формы обратной связи на сайте"). После того, как посетитель заполнит поля и нажмет кнопку Далее, сервер вызывает программу обработки, размещенную на странице mail_01.php. HTML-код этой страницы следующий:

Проверьте правильность введенных данных. Если есть ошибки, исправьте их и нажмите кнопку ОТПРАВИТЬ.<br />
<form action="mail_02.php" method="post" >
<textarea name="mess" cols="40" rows="5" >
<?php
if (isset($_POST['name_01'])) {$name_01 = $_POST['name_01'];}
if (isset($_POST['name_02'])) {$name_02 = $_POST['name_02'];}
if (isset($_POST['name_03'])) {$name_03 = $_POST['name_03'];}
if (isset($_POST['address'])) {$address = $_POST['address'];}

echo "Фамилия: $name_01 \n"; //Ввод name_01 из формы
echo "Имя: $name_02 \n"; //Ввод name_02 из формы
echo "Отчество: $name_03 \n"; //Ввод name_03 из формы
echo "Адрес: $address"; //Ввод address из формы
?>
</textarea>
<br /><br />
<input type="submit" value="ОТПРАВИТЬ"/>
</form>

В результате выполнения этой программы выводится новая форма обратной связи с одним только полем <textarea >...</textarea>, в которое занесены введенные посетителем данные. Для этого используется оператор echo. Его аргументами, как видим, являются введенные в форму строчки name_01, name_02, name_03 и address, то есть содержание тегов <input> созданной нами формы. Все данные можно править обычным способом (можете попробовать):

Проверьте правильность введенных данных. Если есть ошибки, исправьте их и нажмите кнопку "ОТПРАВИТЬ".

Фамилия: Пупкин Имя: Иван Отчество: Иванович Адрес: Москва, Кремль

После выполнения "работы над ошибками", посетитель нажимает кнопку ОТПРАВИТЬ, и только после этого все данные отправляются на адрес электронной почты с помощью программы, размещенной на странице mail_02.php, указанной в данной форме обратной связи. Текст этой страницы также исключительно простой:

<?php
if (isset($_POST['mess'])) {$mess = $_POST['mess'];}

$to = "pupkin@rambler.ru"; //Укажите свой адрес e-mail
$headers = "Content-type: text/plain; charset = utf-8";
$subject = "Сообщение с вашего сайта"; //Тема письма
$message = " $mess";
$send = mail ($to, $subject, $message, $headers); //Отправка письма
if ($send == 'true')
{
echo "<b>Спасибо за отправку вашего сообщения!<p>";
}
else
{
echo "<p><b>Сообщение не отправлено. Приносим свои извинения.";
echo "<p><b>Попробуйте повторить отправку позже";
}
?>

Не забывайте, что страница с формой обратной связи и страницы mail_01.php и mail_02.php должны размещаться на сайте в одном каталоге (папке) и, конечно, ваш хостинг должен поддерживать РНР. Также обратите внимание, что проверить работоспособность данной формы, как и любой другой, можно только на сервере или на локальном компьютере с помощью виртуального сервера. Описанный способ проверки и исправления ошибок при заполнении формы обратной связи может показаться опытному программисту неуклюжим, но он не требует знания РНР и его применение не вызовет трудностей у начинающего веб-дизайнера.

24.02.2012 г.

Ещё статьи по теме "Создание, оптимизация и раскрутка сайта":
• Как раскрутить сайт (серия статей)
• Создание формы обратной связи
• Создание иконки для сайта
• Создание выпадающего меню
• Вебдизайн с jQuery - это очень просто!
• Курсор как элемент веб-дизайна
• Создание гостевой книги на сайте
• Фон для сайта
• Вывод текущей даты на сайте
• Создание бегущей строки на сайте
• Создание "схемы проезда" на сайте
• Ключевые слова и продвижение сайта
• Оптимизация и ускорение компьютера. Обзоры программ

см. все статьи по веб-дизайну >>