Создадим форму без перезагрузки страницы на фреймворке Laravel с использованием технологии ajax. Для начала пропишем роуты в web.php
// Новая страница с формой — вывод
Route::get(‘/feedback’, array(
‘as’ => ‘site.index.feedback’,
‘uses’ => ‘IndexController@feedback’
));
// Роут ajax контроллера
Route::post(‘/feedback’, ‘AjaxController@store’);
Создадим вид (шаблон с версткой)
/resources/views/site/index/feedback.blade.php с формой
<form id="dismissal-form" method="POST" action="{{ $url }}"> {{ csrf_field() }} <div class="form-container"> <h3 class="form-header">Уважаемый коллега!</h3> <div class="form-input-container"> <input name="fio" class="form-text-input" type="text" placeholder="Ф.И.О (по желанию)"> <input name="position" class="form-text-input" type="text" placeholder="Должность"> <input name="experience" class="form-text-input" type="text" placeholder="Стаж работы в компании"> </div> </div> <input type="button" id="dismissal-form-btn" name="submit" value="Отправить" class="form-submit-button"> </form>
и подключим там же скрипт js для обработки формы
<script src="js/script_form.js"></script>
Содержимое файла js/script_form.js
$(document).ready(function($) { $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') } }); $("#dismissal-form-btn").click( function(e){ e.preventDefault(); $.ajax({ url: "/feedback", //url страницы (action_ajax_form.php) type: "POST", //метод отправки dataType: "html", //формат данных data: $("#dismissal-form").serialize(), // Сеарилизуем объект success: function(response) { //Данные отправлены успешно $(".form-pop-up-text .form-lowertext").html("Спасибо за Ваши ответы и за труд в нашей компании.") $(".form-pop-up-text .form-lowertext1").html("Желаем Вам успехов на новом месте!") $("#pop-up-btn").addClass("success"); $(".form-pop-up").show(); $(".form-pop-up-text").show(); console.log(response); }, error: function(response) { // Данные не отправлены $(".form-pop-up-text .form-lowertext").html("Произошла ошибка") $(".form-pop-up-text .form-lowertext1").html("Попробуйте снова") $(".form-pop-up").show(); $(".form-pop-up-text").show(); console.log(response); } }); } ); $(".pop-up-btn").click( function (){ if (document.getElementById("pop-up-btn").classList.contains("success")) { document.location.href = "https://ostrov-chistoty.by"; } else{ $(".form-pop-up").hide(); $(".form-pop-up-text").hide(); } } ) });
В каталоге контроллеров /app/Http/Controllers/ создадим новый контроллер AjaxController.php
Внутри контроллера создаем метод отправки формы:
public function store(Request $request) { // email из настроек админки сайта - либо вписываем строго $settings = "info.site.com"; $settings = $this->getSettings('SettingsSite', 'emails'); $headers = 'MIME-Version: 1.0' . "\r\n"; $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n"; $title = ($_POST["fio"] == "" ? "Анонимно" : $_POST["fio"]) . " - " . $_POST["position"] . " - стаж " . $_POST["experience"]; $text = $title . "<br>"; $text .= "Текст письма ... ФИО: ".$_POST["fio"]; mail($settings['recipient_form'], $title, $text, $headers); $response = array( 'status' => 'success', 'msg' => $request->message, ); return response()->json($response); }
В контроллере /app/Http/Controllers/IndexController.php добавим метод отрисовки шаблона:
public function feedback() { return view('site.index.feedback', array( 'url' => $_SERVER['REQUEST_URI'] )); }
Проделав все по инструкции, вы сможете создать на Laravel любую форму без перезагрузки на ajax.