Делаем форму обратной связи на PHP. Форма обратной связи на PHP с отправкой на e-mail Проверка формы на адекватность вводимых данных

  • Press the download button above. The zip file contains all the code you need for the form.
  • Unzip the file feedback-form-in-html
  • Open the file named "handler.php"
    Look for sendEmailTo add the email addresses to receive the form submissions.
  • Upload the whole folder to your website
  • Open the formpage.html in your browser and test
  • The sections below explain the code of this form

    The HTML Code Feedback

    Please provide your feedback below:

    How do you rate your overall experience?

    Bad Average Good

    Comments: Your Name: Email: Post Posted your feedback successfully! Error Sorry there was an error sending your form. CSS Styling The following extra CSS styling is used to make the form look better jQuery Form submission handling $(function() { function after_form_submitted(data) { if(data.result == "success") { $("form#reused_form").hide(); $("#success_message").show(); $("#error_message").hide(); } else { $("#error_message").append(""); jQuery.each(data.errors,function(key,val) { $("#error_message ul").append("
  • "+key+":"+val+"
  • "); }); $("#success_message").hide(); $("#error_message").show(); //reverse the response on the button $("button", $form).each(function() { $btn = $(this); label = $btn.prop("orig_label"); if(label) { $btn.prop("type","submit"); $btn.text(label); $btn.prop("orig_label",""); } }); }//else } $("#reused_form").submit(function(e) { e.preventDefault(); $form = $(this); //show some response on the button $("button", $form).each(function() { $btn = $(this); $btn.prop("type","button"); $btn.prop("orig_label",$btn.text()); $btn.text("Sending ..."); }); $.ajax({ type: "POST", url: "handler.php", data: $form.serialize(), success: after_form_submitted, dataType: "json" }); }); }); Form Validations HTML5 validations are used. For example, the Name and Email fields have "required" validation and the email field is of input type "email".

    Similarly, the message field (textarea) allows a max length of 6000 characters

    using the built-in HTML5 validations has the advantage that the browser itself shows the error message.
    You can customize those validations to fit your needs

    Server Side Handling Every form requires a server side script to collect the form data and do the processing like send emails, save to database etc. This form comes with a PHP script to handle the form submissions. PHP is widely supported server side scripting platform.

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

    Сегодня мы сделаем простое решение данной задачи. Используя jQuery, PHP и класс PHPMailer форма посылает предложение пользователя прямо в ваш почтовый ящик.

    HTML

    Начнем с разметки HTML. Стили включаются вверху документа, а файлы JavaScript - внизу. Таким образом оптимизируется процесс загрузки страницы, так скрипты грузятся последними, позволяя пользователю увидеть содержание страницы.

    demo.html

    Форма обратной связи с использованием PHP и jQuery | Демонстрация для сайта сайт Обратная связь

    Пожалуйста, включите контактную информацию, если вы хотите получить ответ.

    Отправить

    Внутри body находится div #feedback . Он размещен внизу справа в окне с помощью фиксированного позиционирования, что будет видно в разделе урока, посвященного CSS.

    Внутри данного div размещаются пять цветных элементов span . Каждый из них имеет 20% ширины и смещается влево. Таким образом, они размещаются точно на по всей ширине div #feedback .

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

    CSS

    Перейдем к заданию стилей для формы. Для начала скажем несколько слов о том, из чего состоит структура таблицы стилей. Если взглянуть на определения CSS, представленные ниже, то можно заметить что каждое правило начинается с #feedback . Таким образом организуется подобие пространства имен в CSS, что облегчает добавление кода к существующему веб-сайту без конфликтов.

    styles.css - Часть 1

    #feedback{ background-color:#9db09f; width:310px; height:330px; position:fixed; bottom:0; right:120px; margin-bottom:-270px; z-index:10000; } #feedback .section{ background:url("img/bg.png") repeat-x top left; border:1px solid #808f81; border-bottom:none; padding:10px 25px 25px; } #feedback .color{ float:left; height:4px; width:20%; overflow:hidden; } #feedback .color-1{ background-color:#d3b112;} #feedback .color-2{ background-color:#12b6d3;} #feedback .color-3{ background-color:#8fd317;} #feedback .color-4{ background-color:#ca57df;} #feedback .color-5{ background-color:#8ecbe7;} #feedback h6{ background:url("img/feedback.png") no-repeat; height:38px; margin:5px 0 12px; text-indent:-99999px; cursor:pointer; } #feedback textarea{ background-color:#fff; border:none; color:#666666; font:13px "Lucida Sans",Arial,sans-serif; height:100px; padding:10px; width:236px; resize:none; outline:none; overflow:auto; -moz-box-shadow:4px 4px 0 #8a9b8c; -webkit-box-shadow:4px 4px 0 #8a9b8c; box-shadow:4px 4px 0 #8a9b8c; }

    Первый элемент, для которого задается стиль - это div #feedback . Ему назначается фиксированная позиция и привязка к окну браузера. После него идет определение для div .section и пяти цветных элементов span . Данные элементы отличаются только цветом фона, который назначается отдельно для каждого класса.

    В самом низу представленной части CSS файла определяются правила для вывода области текста.

    styles.css - Часть 2

    #feedback a.submit{ background:url("img/submit.png") no-repeat; border:none; display:block; height:34px; margin:20px auto 0; text-decoration:none; text-indent:-99999px; width:91px; } #feedback a.submit:hover{ background-position:left bottom; } #feedback a.submit.working{ background-position:top right !important; cursor:default; } #feedback .message{ font-family:Corbel,Arial,sans-serif; color:#5a665b; text-shadow:1px 1px 0 #b3c2b5; margin-bottom:20px; } #feedback .arrow{ background:url("img/arrows.png") no-repeat; float:right; width:23px; height:18px; position:relative; top:10px; } #feedback .arrow.down{ background-position:left top;} #feedback h6:hover .down{ background-position:left bottom;} #feedback .arrow.up{ background-position:right top;} #feedback h6:hover .up{ background-position:right bottom;} #feedback .response{ font-size:21px; margin-top:70px; text-align:center; text-shadow:2px 2px 0 #889889; color:#FCFCFC; display:block; }

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

    jQuery

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

    script.js - Часть 1

    $(document).ready(function(){ // Относительный URL скрипта submit.php. // Вероятно, вам нужно будет его поменять. var submitURL = "submit.php"; // Кэшируем объект feedback: var feedback = $("#feedback"); $("#feedback h6").click(function(){ // Значения свойств анимации хранятся // в отдельном объекте: var anim = { mb: 0, // Поле снизу pt: 25 // Отступ сверху }; var el = $(this).find(".arrow"); if(el.hasClass("down")){ anim = { mb: -270, pt: 10 }; } // Первая анимация перемещает вверх или вниз форму, а вторая перемещает // заголовок, так что он выравнивается по минимизированной версии feedback.stop().animate({marginBottom: anim.mb}); feedback.find(".section").stop().animate({paddingTop:anim.pt},function(){ el.toggleClass("down up"); }); });

    Для того, чтобы код был простым и понятным, вверху создается объект anim , который содержит значения для анимации, и размещается оператор if . В зависимости ото существования класса ‘down ‘ на стрелке, мы разворачиваем или сворачиваем форму.

    Вторая часть script.js обрабатывает работу с AJAX с submit.php .

    script.js - Часть 2

    $("#feedback a.submit").live("click",function(){ var button = $(this); var textarea = feedback.find("textarea"); // Мы используем класс working не только для задания стилей для кнопки отправки данных, // но и как своеобразный замок для предотвращения множественных генераций формы. if(button.hasClass("working") || textarea.val().length < 5){ return false; } // Запираем форму и изменяем стиль кнопки: button.addClass("working"); $.ajax({ url: submitURL, type: "post", data: { message: textarea.val()}, complete: function(xhr){ var text = xhr.responseText; // Данная операция помогает пользователю определить ошибку: if(xhr.status == 404){ text = "Путь к скрипту submit.php неверный."; } // Прячем кнопку и область текста, после которой // мы показывали полученный ответ из submit.php button.fadeOut(); textarea.fadeOut(function(){ var span = $("",{ className: "response", html: text }) .hide() .appendTo(feedback.find(".section")) .show(); }).val(""); } }); return false; }); });

    Мы используем метод jQuery для AJAX $.ajax() для взаимодействия с submit.php . Данный метод дает немного больше контроля над соединением, чем $.get() и $.post() .

    Одним из преимуществ метода является видимость свойств объекта во "всей" возвратной функции. Здесь мы проверяем статус ответа на соответствие ошибке 404 (не найдена страница) , и выводим сообщение пользователю с просьбой проверить путь submitURL .

    Теперь пора перейти к завершающей части - PHP.

    PHP

    PHP обрабатывает данные, переданные с AJAX, проверяет их и посылает e-mail сообщение по заданному адресу.

    submit.php

    // Здесь нужно ввести свой адрес $emailAddress = "[email protected]"; // Используем сессию, чтобы предотвратить флудинг: session_name("quickFeedback"); session_start(); // Если последняя форма была отправлена меньше 10 секунд назад, // или пользователь уже послал 10 сообщений за последний час if($_SESSION["lastSubmit"] && (time() - $_SESSION["lastSubmit"] < 10 || $_SESSION["submitsLastHour"] > 10)){ die("Пожалуста, подождите несколько минут, прежде чем отправить сообщение снова."); } $_SESSION["lastSubmit"] = time(); $_SESSION["submitsLastHour"]++; require "phpmailer/class.phpmailer.php"; if(ini_get("magic_quotes_gpc")){ $_POST["message"] = stripslashes($_POST["message"]); } if(mb_strlen($_POST["message"],"utf-8") < 5){ die("Ваше сообщение слишком короткое."); } $msg = nl2br(strip_tags($_POST["message"])); // Используем класс PHPMailer $mail = new PHPMailer(); $mail->IsMail(); // Добавляем адрес получателя $mail->AddAddress($emailAddress); $mail->Subject = "Новое письмо из формы обратной связи"; $mail->MsgHTML($msg); $mail->AddReplyTo("noreply@".$_SERVER["HTTP_HOST"], "Форма обратной связи на демо странице"); $mail->SetFrom("noreply@".$_SERVER["HTTP_HOST"], "Форма обратной связи на демо странице"); $mail->Send(); echo "Спасибо!";

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

    E-mail отправляется с помощью класса PHPMailer . Внимание! Он работает только с PHP5.

    Несколько методов PHPMailer используется для конфигурации исходящего e-mail. Метод IsMail() указывает классу использовать внутреннюю функцию PHP mail() . Метод AddAddress() добавляет адрес получателя (вы можете добавить более одного получателя с помощью дополнительных вызовов данного метода). После добавления темы письма и текста указывается адрес для ответов и производится отправка сообщения.

    Готово!

    Заключение

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

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

    Все вышеперечисленные моменты будут рассмотрены в нашем обзоре и подробно прокомментированы.

    Итак, начинаем создание формы обратной связи:

    HTML

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

    < form method= "post" action= "mail.php" > < div class = "left" > < label for = "name" > Имя: < input maxlength= "30" type= "text" name= "name" /> < label for = "phone" > Телефон: < input maxlength= "30" type= "text" name= "phone" /> < label for = "mail" > E- mail : < input maxlength= "30" type= "text" name= "mail" /> < div class = "right" > < label for = "message" > Сообщение: < textarea rows= "7" cols= "50" name= "message" > < input type= "submit" value= "Отправить" />

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

    Согласен, пока все некрасиво и ничего не понятно, но мы только начали.

    Рассмотрим приведенный выше код подробно:

    • < form method= "post" action= "mail.php" > …


      для того, чтобы создать форму необходимо использовать тег form. Именно он определяет начало и конец формы для интерпретатора кода. У него, как и у любого тега, есть целый набор атрибутов, но обязательных для работы формы всего два, это method (метод отправки запроса на сервер, для форм стандартно используют post) и action (указывает путь к файлу-обработчику формы, именно в этом файле будет содержаться скрипт на PHP, который после будет отправлять введенные пользователем значения нам на почту, в нашем случае мы видим, что это файл называется mail.php и лежит он в том же директории сайта, что и рассматриваемая нами страница).
    • < input maxlength= "30" type= "text" name= "name" />


      Далее у нас следуют инпуты. Это собственно сами поля формы в которые пользователи будут вводить необходимую нам информацию (type="text" говорит о том, что это будет текст). Атрибут maxlength указывает сколько символов может ввести пользователь в данное поле формы. Самый важный атрибут это name – он задает имя конкретного поля. Именно по этим именам в дальнейшем PHP скрипт будет обрабатывать поступающую в него информацию. При желании можно еще задать атрибут placeholder, который выводит внутри поля текст исчезающий при установке курсора внутри нее. Одной из проблем плейсхолдера является то, что он не поддерживается некоторыми старыми браузерами.
    • < label for = "name" > Имя:


      Используется в случае если мы отказались от плейсхолдеров. Обычная подпись поля, атрибут for сообщает к какому конкретно полю относится данная подпись. Значением указывается name интересующего нас поля.
    • < textarea rows= "7" cols= "50" name= "message" >


      Также как и инпут предназначен для введения пользователем информации, только на этот раз поле заточено для длинных сообщений. Rows указывает размер поля в строках, cols в символах. В целом они задают высоту и ширину нашего поля.
    • < input type= "submit" value= "Отправить" />


      О том, что это кнопка для отправки формы нам сообщает type="submit", а value задает текст, который будет внутри этой кнопки.
    • < div class = "right" >


      использованы только для дальнейшего визуального оформления формы.
    CSS

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

    Мы использовали данный код:

    form { background: #f4f5f7; padding: 20px; } form . left, form . right { display: inline- block; vertical- align: top; width: 458px; } form . right { padding- left: 20px; } label { display: block; font- size: 18px; text- align: center; margin: 10px 0px 0px 0px; } input, textarea { border: 1px solid #82858D; padding: 10px; font- size: 16px; width: 436px; } textarea { height: 98px; margin- bottom: 32px; } input[ type= "submit" ] { width: 200px; float: right; border: none; background: #595B5F; color: #fff; text- transform: uppercase; }

    Подробно расписывать CSS я не вижу смысла, обращу Ваше внимание лишь на ключевые моменты:

  • Не стоит писать оформление под каждый тег в форме. Старайтесь строить свои селекторы так, чтобы парой строк кода оформлять все необходимые Вам элементы.
  • Не используйте для переноса строк и создания отступов лишние теги по типу < br>, < p> и тд, с этими задачами прекрасно справляется CSS со свойством display: block и margin с padding. Больше о том, почему не стоит пользоваться < br> в верстке вообще можете почитать в статье Тэг br, а так ли он нужен? .
  • Не стоит пользоваться табличной версткой для форм. Это противоречит семантике этого тега, а поисковики любят семантичный код. Для того, чтобы формировать визуальную структуру документа нам достаточно тегов div, и заданных им в CSS свойств display: inline-block (выстраивает блоки в ряд) и vertical-align: top (не дает им разбежаться по экрану), задаем им необходимую высоту и вуаля, ничего лишнего и все расположено так, как нам нужно.
  • Для желающих экономить свое время на оформлении сайтов могу посоветовать пользоваться CSS фреймворками при создании сайтов, особенно самописных. Мой выбор в этом плане- Twitter Bootstrap . Урок по оформлению форм с его использованием можно посмотреть .

    PHP

    Ну вот и пришло время сделать нашу форму работоспособной.

    Заходим в наш корневой каталог сайта и создаем там файл mail.php, к которому мы ранее указывали путь в атрибуте action тега form.

    В конечном итоге его код будет выглядеть следующим образом:

    Ваше сообщение успешно отправлено

    Обсуждение HTML и CSS части этого документа можно пропустить. По своей сути это обычная страница сайта, которую Вы можете оформить по своему желанию и необходимости. Рассмотрим же важнейшую ее часть – PHP скрипт обработки формы:

    $back = "

    Вернуться назад

    " ;

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

    if (! empty ($_POST [ "name" ] ) and ! empty ($_POST [ "phone" ] ) and ! empty ($_POST [ "mail" ] ) and ! empty ($_POST [ "message" ] ) ) { //внутрення часть обработчика } else { echo "Для отправки сообщения заполните все поля! $back " ; exit ; }

    Тут мы прикручиваем проверку формы на наполненность полей. Как вы догадались, в части $_POST["name"] в кавычках мы пишем значение атрибута name наших инпутов.

    Если все поля заполнены, то скрипт начнет обрабатывать данные в своей внутренней части, если же хоть одно поле не было заполнено, то на экран пользователя выведется сообщение с требованием заполнить все поля формы echo "Для отправки сообщения заполните все поля! $back" и ссылкой для возврата на предыдущую страницу, которую мы создали самой первой строкой.

    Дале вставляем во внутреннюю часть обработчика формы:

    $name = trim (strip_tags ($_POST [ "name" ] ) ) ; $phone = trim (strip_tags ($_POST [ "phone" ] ) ) ; $mail = trim (strip_tags ($_POST [ "mail" ] ) ) ; $message = trim (strip_tags ($_POST [ "message" ] ) ) ;

    Таким образом мы очистили вводимые пользователем данные от html тегов и лишних пробелов. Это позволяет нам обезопасить себя от получения вредоносного кода в высылаемых нам сообщениях.

    Проверки можно и усложнить, но это уже по вашему желанию. Минимальную защиту на серверной стороне мы уже поставили. Дальнейшее мы сделаем на стороне клиента используя JS.

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

    После чистки тегов добавляем отправку сообщения:

    mail ("почта_для_получения_сообщений@gmail.com" , "Письмо с адрес_вашего_сайта" , "Вам написал: " . $name . "
    Его номер: " . $phone . "
    Его почта: " . $mail . "
    Его сообщение: " . $message , "Content-type:text/html;charset=windows-1251" ) ;

    Именно эта строка и занимается формированием и отправкой сообщения к нам. Заполняется она следующим образом:

  • "почта_для_получения_сообщений@gmail.com" – сюда между кавычек вставляете свою почту
  • "Письмо с адрес_вашего_сайта" – это тема сообщения, которое будет приходить на почту. Можно написать сюда что угодно.
  • "Вам написал: ".$name." < br /> Его номер: ".$phone." < br /> Его почта: ".$mail." < br /> Его сообщение: ".$message – формируем сам текст сообщения. $name – вставляем информацию заполненную пользователем через обращение к полям из предыдущего шага, в кавычках описываем что значит это поле, тегом < br /> делаем перенос строки, чтобы сообщение в целом было читабельно.
  • Content-type:text/html;charset=windows-1251 - в конце идет явное указание типа данных передаваемого в сообщении и его кодировки.
  • ВАЖНО!

    Кодировка указанная в «голове» документа ( < meta http- equiv= "Content-Type" content= "text/html; charset=windows-1251" /> ), кодировка из сообщения Content-type:text/html;charset=windows-1251 и в целом кодировка файла PHP должны совпадать иначе в получаемых на почту сообщениях вместо русских или английских букв будут выводиться «кракозябры».

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

    Проверка формы на адекватность вводимых данных

    Чтобы пользователи по невнимательности не промахивались полями и заполняли все корректно стоит поставить проверку вводимых данных.

    Это можно сделать как на PHP на стороне сервера, так и на JS на стороне клиента. Я использую второй вариант, поскольку так человек сразу может узнать что он сделал не верно и исправить ошибку не делая дополнительных переходов по страницам.

    Код скрипта вставляем в том же файле, где у нас располагается HTML часть формы. Для нашего случая он будет выглядеть так:

    < script> function checkForm(form) { var name = form. name. value; var n = name. match(/ ^[ A- Za- zА- Яа- я ] * [ A- Za- zА- Яа- я ] + $/ ) ; if (! n) { alert("Имя введено неверно, пожалуйста исправьте ошибку" ) ; return false ; } var phone = form. phone. value; var p = phone. match(/ ^[ 0 - 9 + ] [ 0 - 9 - ] * [ 0 - 9 - ] + $/ ) ; if (! p) { alert("Телефон введен неверно" ) ; return false ; } var mail = form. mail . value; var m = mail . match(/ ^[ A- Za- z0- 9 ] [ A- Za- z0- 9 \. _- ] * [ A- Za- z0- 9 _] *@ ([ A- Za- z0- 9 ] + ([ A- Za- z0- 9 - ] * [ A- Za- z0- 9 ] + ) * \. ) + [ A- Za- z] + $/ ) ; if (! m) { alert("E-mail введен неверно, пожалуйста исправьте ошибку" ) ; return false ; } return true ; }

    Ну а теперь обычный разбор:

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

    < form method= "post" action= "mail.php" onSubmit= "return checkForm(this)" >

    Теперь по пунктам забираем состав проверки:


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

    На этом уроке мы познакомимся с функцией mail () , на примере создания формы обратной связи на PHP с последующей отправкой полученных данных на почту.

    Для этого создадим два файла - forma.php и mail.php . В первом файлике будет находиться только форма с полями для ввода пользователем данных. Внутри тега form - кнопка "Отправить" и атрибут action , который ссылается на обработчик - mail.php , именно к нему обращаются данные из формы при нажатии кнопки "Отправить" . В нашем примере данные формы отправляются на веб-страницу с названием «/mail.php» . На этой странице прописан скрипт на PHP , который обрабатывает данные формы:


    Данные формы отправляются методом POST (обрабатывается как $ _POST ). $ _POST - это массив переменных, переданных текущему скрипту через метод POST .

    Ниже вы видите содержимое файла forma.php , поля которой заполняет сам пользователь на каком-нибудь веб-сайте. Все поля для ввода данных обязательно должны иметь атрибут name , значения мы прописываем сами, исходя из логики.




    Форма обратной связи на PHP с отправкой на почту


    Форма обратной связи на PHP





    Оставьте сообщение:
    Ваше имя:



    E-mail:

    Номер телефона:

    Сообщение:

    Текстовая область может содержать неограниченное количество символов-->







    Так форма визуально выглядет в браузере.

    Далее пишем код для файла mail.php . Придумываем сами имена для переменных. В PHP переменная начинается со знака $ , а затем имя переменной. Текстовое значение переменной заключается в кавычки. С помощью переменных на емайл администратора передается содержимое формы, просто подставив в квадратные скобки имя элемента формы - значение name .

    Таким образом данные из массива $_POST будут переданы соответствующим переменным и отправлены на почту при помощи функции mail . Давайте заполним нашу форму и нажмем кнопку отправить. Не забудьте указать ваш е-майл. Письмо пришло моментально.

    Ремонт