Здравствуйте, сегодня поговорим о том, как создать форму обратной связи, используя ajax.
Для создания обратной связи нам нужно два файла, в одном будет html код и ajax запрос, в другом файле будет php код, который будет отправлять сообщение.
Ну что же приступим, сначала пропишем поля, которые будет заполнять пользователь и кнопку.
<div> <labelВаше имя:</label> <input type="text" id="pole1"/> <labelВаше сообщение:</label> <textarea id="pole2"/textarea> <span> id="btn">Отправить</span> <div class="text"</div> </div>
Используя css можете оформить этим поля на свой вкус. Я сразу перейду к самому интересному ajax запросу.
<script> $("#btn").click(function () { var p1 = $("#pole1").val(); var p2 = $("#pole2").val(); $.ajax({ type: "POST", url: "http://mysite.ru/feedback.php", data: "name="+p1+"&text="+p2, success: function(){ $(".text").text("Ваше сообщение отправлено, мы свяжемся с вами в ближайшее время"); } }); }); </script>
Немного пояснения, в type вы указываете способ передачи данных, в нашем случае, это POST.
В url надо написать путь к вашему php файлу.
В data пишут данные, которые вы передаете.
success срабатывает, если запрос успешно выполнен.
Теперь перейдем к файлу feedback.php в нем надо написать код для отправки сообщения.
$message = "Имя: ".$_POST['name']." "; $message .= "Текст: ".$_POST['text']; mail("myemail@mail.ru", "Обратная связь", $message);
Принцим работы довольно простой, в нашем скрипте мы сначала получаем данные из полей, а затем передаем их в файл feedback.php и выполняем этот файл.
Если остались вопросы, то пишите.