Создание своего сайта на Processwire по шагам. Подключение формы обратной связи. Урок 7

В этом уроке мы подключим форму обратной связи - последнюю страницу из нашего шаблона. Для этих целей я создал в папке шаблонов файл contact.php и скопировал туда div с уникальной частью содержимого из файла contact.html. Не забываем задать этому блоку идентификатор id="main-content". В итоге у меня получилось следующее:

Вкратце опишу последовательность действий, если кто забыл: создаём шаблон в админке, привязываем к нему файл, а далее создаём страницу и уже к ней привязываем шаблон.

И если всё сделано правильно, то страница отобразится в меню и кликнув по ней, вы попадёте на страницу, которая будет выглядеть примерно следующим образом:

Однако, этого всё ещё недостаточно для того, чтобы сделать форму работоспособной. Сперва нам будет необходимо прописать полям формы атрибут name, который является своего рода идентификатором, по имени которого и будет в дальнейшем происходить обращение к полям формы. Кроме того, поскольку отправка формы будет производиться с помощью метода POST, я так же добавил тэгу form атрибут method.

В скриншоте ниже я выделил код, который добавил в HTML код формы:

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

<?
$contactFormRecipient = 'ваш почтовый адрес';
$contactPageID = '1033'; // ID страницы, на которую будет происходить переадресация

if ($input->post->name) {
  $message = '
  <p>Пришло письмо от '.$input->post->name.' со следующими контактными данными:</p>
  <p>Телефон: ' . $input->post->phone . '</p>
  <p>Email: ' . $input->post->email . '</p>
  <p>Текст сообщения: ' . $input->post->message . '</p>
  ';

  $mail = wireMail();
  $mail->to($contactFormRecipient)
  ->from($input->post->email)
  ->subject('Contact form submission')
  ->bodyHTML($message)
  ->send();

  $session->flashMessage = 'Спасибо за ваше сообщение! Вскоре ожидайте нашего звонка.';
  $session->sent = true;
  $session->redirect($pages->get($contactPageID)->url);
}
?>

Остановимся подробнее на самом коде. Поскольку сама страница находится на той же странице, что и форма, то код у нас должен срабатывать только в том случае, когда происходит отправка данных. Как мы можем это проверить? Давайте подумаем.

Метод отправки формы у нас называется POST. А когда происходит отправка данных, они попадают в объект $input->post, в котором уже непосредственно хранятся отправленные значения формы, которые можно получить следующим образом:

$input->post->name

Напомню, что name здесь является значением атрибута name поля формы. Если бы это было поле с телефоном, то обратиться, к нему можно было так:

$input->post->phone

Следовательно, если там у нас находятся какие-то данные, это значит что отправка формы уже произошла. То есть, осуществить проверку на то, были ли у нас отправлены данные, можно следующим образом:

if ($input->post->name) {
  …
}

Затем в переменной $message мы формируем тело самого письма, а в переменной $mail получаем объект, методы которого будем использовать в дальнейшем, для работы с почтой:

$mail = wireMail();
$mail->to($contactFormRecipient)
->from($input->post->email)
->subject('Contact form submission')
->bodyHTML($message)
->send();

Здесь мы устанавливаем получателя, адрес отправителя, тему письма, тело письма и с помощью метода send() отправляем всё это на почту.

Следующие две строки кода я пропущу (к ним мы вернёмся позже) и начну с этой строки:

$session->redirect($pages->get($contactPageID)->url);

На основании ID страницы формируется её адрес и с помощью метода redirect происходит переадресация на эту страницу (в данном случае - текущую). Это нужно для того, чтобы предотвратить повторную отправку формы в том случае, если пользователь нажмёт кнопку «Обновить» в браузере.

После того как данные будут отправлены, неплохо бы вывести какое-то благодарственное сообщение. Однако, тут же возникает вопрос – а как же это сделать, если после отправки формы, сразу же срабатывает переадресация? Вот для таких случаев и придумали сессионные переменные. Грубо говоря, это данные, к которым можно обратиться и после перезагрузки страницы. Это как раз и происходит в тех двух строках кода, которые мы вначале опустили:

$session->flashMessage = 'Спасибо за ваше сообщение! Вскоре ожидайте нашего звонка.';
$session->sent = true;

Осталось только разобраться с местом в самом шаблоне, где эта сессионная переменная будет выводиться. Для этого дела в самом шаблоне предусмотрен div с идентификатором success

Значит сделать это можно с помощью следующего кода:

<div id="success">
  <?php if($session->flashMessage):?>
    <div class="alert alert-success" role="alert">
      <?php echo $session->flashMessage;?>
    </div>
  <?php endif;?>
</div>

Думаю, в объяснении он не нуждается – происходит проверка на существование переменной и собственно её вывод.

Ну и в конце самого файла прописываем:

<?php
  $session->remove('flashMessage');
  $session->sent = false;
?>

Здесь происходит удаление сессионной переменной, поскольку необходимости в ней уже нет.

На этом данный урок закончен. Конечно, форма получилась самой обычной и здесь есть ещё над чем поработать: прикрутить капчу, сделать проверку некоторых полей на пустоту и произвести валидацию данных. Однако, целью данного урока было не охватить всё, а лишь показать самые основы.

Код файла к данному уроку прикладываю. Не забываем в самом файле указать свои email и ID страницы, на которой находится форма обратной связи (переменные $contactFormRecipient и $contactPageID соответственно).

Категории