Создание привлекательной формы. Часть 3

Создание привлекательной формы

От автора: в предыдущем уроке мы писали клиентский скрипт, проверяющий заполнение обязательных полей и отметку чекбокса подтверждения. При этом отмечалось, что проверка на стороне клиента никоим образом не избавляет нас от проверок на стороне сервера.

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

Итак, приступим…

План урока:

    1. Написание серверного скрипта.

Детали учебника

Тема: PHP

Бесплатный курс по PHP программированию

Освойте курс и узнайте, как создать веб-приложение на PHP с полного нуля

Получить курс сейчас!

Сложность: Средняя

Урок: Видео версия (.mp4)

Время: 00:45:54

Размер архива: 90 Mb

скачать исходникискачать урок

Алгоритм работы серверного скрипта будет во многом похож на алгоритм клиентского скрипта. Мы также создадим массив обязательных полей, также будет флаг заполнения обязательный полей и т.д.

Скрипт будет находиться на странице с формой, поэтому под массивом стран создадим массив обязательных полей:

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

Здесь мы имеем ассоциативный массив, ключами которого есть имена полей, а значениями — описания полей. Зачем нужен именно ассоциативный массив? Дело в том, что переданные данные формы мы получаем из глобального массива POST. При этом ключами элементов массива будут как раз имена полей, поэтому при проверке полученных данных достаточно посмотреть имеется ли проверяемый ключ элемента глобального массива POST в массиве fields. Если таковой ключ имеется, значит мы проверяем обязательное поле. Ну а значения массива fields нам пригодятся при выводе информации о том, какие именно из полей не были заполнены. Вот такая вот у нас задумка. Начнем ее реализовывать.

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

Здесь мы сразу же установили флаг заполнения обязательных полей, присвоив ему булево значение FALSE. Как Вы уже могли догадаться, в конце скрипта мы проверим значение переменной $error, если оно останется FALSE — значит с данными все в порядке, иначе — какие-то поля или чекбокс не были заполнены.

Теперь пройдемся в цикле по массиву POST. При этом мы будем проверять выполнение двух условий для каждого из элементов массива POST:

Присутствует ли ключ проверяемого элемента в массиве fields?

Пусто ли значение проверяемого элемента?

Если оба условия выполняются, т.е. если проверяемый элемент (поле формы) есть в списке обязательных и при этом у него пустое значение (поле не заполнено), значит, мы будем изменять значение флага на булево TRUE и запоминать сообщение о незаполненности данного конкретного поля. Для запоминания сообщения мы воспользуемся механизмом сессий, а потому откроем сессию в начале файла, перед массивом стран:

Ну и, собственно, описанный выше цикл:

Бесплатный курс по PHP программированию

Освойте курс и узнайте, как создать веб-приложение на PHP с полного нуля

Получить курс сейчас!

Таким образом, если пользователь не заполнит любое из обязательных полей, то в сессионном массиве $_SESSION[‘res’] создается элемент error с сообщением, что не заполнено конкретное поле. Вот для этого нам как раз и нужен был именно ассоциативный массив fields, чтобы по его ключу получить значение. Ну а благодаря оператору конкатенации (знак точки перед знаком равно) мы дозаписываем значение $_SESSION[‘res’][‘error’], не стирая прежнее. Также стоит обратить внимание на использование функции trim(), которая обрезает концевые пробелы у значения. Сделано это для того, чтобы принимать только значимую для нас информацию, а не пробелы вместо нее.

Теперь проверим, отмечен ли чекбокс:

Если чекбокс был отмечен, то в массиве POST значение соответствующего элемента будет равно строке «on». Если такового значения нет, значит чекбокс не отмечен, и мы в переменную $_SESSION[‘res’][‘error’] добавим соответствующее сообщение и изменим значение флага.

Осталось только проверить значение флага. Если оно будет TRUE — то мы должны прекратить работу с данными формы (т.е., к примеру, не отправлять их на почту, не класть в БД и т.п.). При этом необходимо сообщить пользователю о незаполненности полей и, к тому же, желательно сохранить информацию всех заполненных полей, чтобы пользователь не заполнял их дважды.

Поскольку мы работаем с сессиями, то сделать это не составит особого труда. Мы вновь пройдемся в цикле по массиву POST и в сессионном массиве $_SESSION[‘res’] создадим элементы с ключами, соответствующими именами полей формы.

Если же значение флага не изменилось, значит с данными все ок и можно продолжать работу (отправлять письмо, класть в БД и т.п.). В нашем случае мы ограничимся выводом сообщения пользователю об успешной отправке отзыва — для этого создадим переменную $_SESSION[‘res’][‘ok’]:

Ну и для решения проблемы F5 в конце скрипта организуем редирект, сбрасывая, таким образом, POST-данные:

Осталось вывести все сессионные переменные. Прежде всего, давайте выведем их в качестве возможных значений полей:

Теперь, если пользователь не заполнит все необходимые поля, ему не придется заполнять дважды одно и то же поле — все заполненные ранее поля останутся заполненными.

Перед формой выведем возможные сообщения об успехе или ошибках отправки формы:

Ну а после формы удалим сессионный массив $_SESSION[‘res’] со всеми его переменными. Это делается для того, чтобы не выводить всю эту информацию после успешной отправки формы:

Ну и несколько стилевых правил для классов answerError и answerOk:

Вот, собственно, и все — наш скрипт готов. На протяжении трех уроков мы с Вами создали действительно привлекательную и функциональную форму. Дальше уже Вам решать судьбу принятых данных — несколько строк скрипта и данные могут быть отправлены на электронный адрес или сохранены в БД. Если этот момент также вызывает у Вас интерес — это может быть показано в следующем уроке.

На этом у меня все. Удачи!

Бесплатный курс по PHP программированию

Освойте курс и узнайте, как создать веб-приложение на PHP с полного нуля

Получить курс сейчас!

Разработка веб-приложения на PHP

Скачайте видеокурс и узнайте, как создать веб-приложение на PHP

Скачать

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии (21)