Стилна форма за обратна връзка за уеб сайт с captcha в PHP
В същата статия ще ви кажа как да създадете по-добърформуляр за обратна връзка с помощта на валидиращия клас Validator.php, за който говорих в последната статия. Освен това нашият формуляр за обратна връзка ще съдържаcaptcha, за да се защити от СПАМ роботи.
HTML маркиране
Първо, нека създадем html маркирането за нашияформуляр за контакт.
Тук няма нищо сложно. Най-простият html код на формуляр, където всеки елемент на формуляр е обвит в контейнер
За captcha има отделен контейнерdiv с класа, където ще се показват изображения за сигурност. За да направите това, трябва да напишете следния код в кода:
Можете да прочетете повече закода за сигурност в статията „Създаване на проста captcha за защита на формуляр за обратна връзка“, така че няма да се спирам на това тук.
CSS стилове
В стиловете също няма нищо особено. За полетата се задават полета, рамка и фоново изображение. С помощта на CSS3 заобляме ъглите на текстовите полета. Ние също така създаваме стилове за съобщения за грешки. Така че да продължим.
Обработчик на PHP формуляри
Ако сте забелязали, атрибутътaction на формата е празен. Това означава, че всички данни от формуляра ще бъдат прехвърлени на същата страница, която хоства самия формуляр. Следователно манипулаторът на формуляра за обратна връзка ще се намира в същия файл като самия формуляр. Следователно, в самото начало на файла, където се намира формуляра, трябва да добавите следния код:
Сега за всичко по ред.
Първо, започваме сесията, тъй като кодът за сигурност на формата ще бъде съхранен в сесията.
След това включваме класа за валидиране Validator.php и създаваме екземпляр на класа, който запазваме в променливата $validator. Зададохме и граничните тагове засъобщения за грешка.
След като обектът Валидатор е създаден, задаваме правилата за валидиране. Като начин за задаване на правилата за валидиране избрах многоизмерен асоциативен масив от правила.
Както можете да видите, получаваме съобщения като низ и масив. Направено е нарочно.
Ние показваме съобщения като низ над формуляра за обратна връзка. За да направите това, преди формата, трябва да регистрирате следния php код:
Необходим е и асоциативен масив със съобщения за грешки, за да се маркират текстови полета, които имат грешки. За да направите това, трябва да добавите класаerror_field към контейнераdiv, който съдържа елемента form. Например ще дам кода за текстовото полетема
Трябва също така да се отбележи, че за да не бъдат изтрити потребителските данни при възникване на грешки, атрибутът на текстовото полеvalue трябва да бъде написан със следния код: