Простой php скрипт формы обратной связи без перезагрузки страницы

Простой php скрипт формы обратной связи без перезагрузки страницы

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

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

<div>Ваше Имя:</div> <input type="text" name="name" id="name" value="" /> <div>Ваш E-mail <span>*</span>:</div> <input type="text" name="email" id="email" value="" /> <div>Сообщение <span>*</span>:</div> <textarea name="message" id="message"></textarea> <div class="result"></div> <a href="javascript: void(0);" id="submit">Отправить</a>

Стилей тут нет, думаю, что у вас есть уже свои стили, вам нужна лишь рабочая форма. Так что отсутствие стилей в данном случае только плюс.

2. Далее размещаем вот эту конструкцию вниз сайта перед закрывающимся тегом </body>

<script> $(document).ready(function() { $("#submit").on("click", function() { var name = $("#name").val(); // Получаем имя var email = $("#email").val(); // Получаем e-mail var message = $("#message").val(); // Получаем сообщение $.ajax({ url: "/form.php", // Куда отправляем данные (обработчик) type: "post", data: { "name": name, "email": email, "message": message }, success: function(data) { $(".result").html(data); // Выводим результат } }); }); }); </script>

3. Создаем файл form.php в корне вашего сайта и вставляем туда вот этот код:

<?php header("Content-Type: text/html; charset=utf-8"); if(isset($_SERVER["HTTP_X_REQUESTED_WITH"]) && strtolower($_SERVER["HTTP_X_REQUESTED_WITH"]) === "xmlhttprequest") { if(!isset($_POST["name"]) || !isset($_POST["email"]) || !isset($_POST["message"])) { die(); } function send_form($message) { $mail_to = "your_mail@mail.ru"; // Адрес, куда отправляем письма $subject = "Письмо с обратной связи"; // Тема письма $headers = "MIME-Version: 1.0\r\n"; $headers .= "Content-type: text/html; charset=utf-8\r\n"; $headers .= "From: Система уведомлений <no-reply@".$_SERVER['HTTP_HOST'].">\r\n"; mail($mail_to, $subject, $message, $headers); } $name = strip_tags($_POST["name"]); // Имя $email = strip_tags($_POST["email"]); // E-mail $mess = strip_tags($_POST["message"]); // Сообщение if(!preg_match("|^([a-z0-9_.-]{1,20})@([a-z0-9.-]{1,20}).([a-z]{2,4})|is", strtolower($email))) { // Если e-mail пустой или невалиден echo "E-mail указан некорректно."; die(); } if($mess == "") { // Если сообщение пустое echo "Не указан текст сообщения."; die(); } if($name == "") { // Если имя не указано $name = "Не указано"; } $message = <<<HTML <b>Имя отправителя</b>: {$name}<br> <b>E-mail</b>: {$email}<br><br> <b>Текст письма</b>: {$mess} HTML; send_form($message); // Если ранее описанных ошибок нет - отправляем сообщение echo "Сообщение успешно отправлено!"; } else { die(); } ?>

Заменяем your_mail@mail.ru на email, на который хотим получать письма с этой формы. Здесь также вы можете изменить тексты ошибок и успешной отправки, а также добавить свои поля, если нужно.

Вот и всё! Форма обратной связи для сайта без перезагрузки страницы готова.

Помогла статья? Угости чашечкой кофе =)

Если вы не видите кнопку "Скачать"
отключите блокировщик рекламы

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

  1. Вадим 06 октября 2020, 11:29 # 0
    Рабочий скрипт, спасибо большое. Делал для отзывов на одностраничнике, добавил дату без проблем

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