AJAX форма на jQuery

В файле нужного нам шаблона создаем форму через объект. Можно также сделать форму просто html кодом, главное, чтобы названия полей совпадали с теми, которые потом будут использоваться далее в файле views/ajax/request.php

//Создаем ajax csrf токен до любого вывода html на странице
$ajax_csrf_token = Form :: createAndDisplayAjaxTokenCSRF();

$fields = [["Имя", "char", "name", ["required" => true]),
                ["Телефон", "phone", "phone"],
                ["Email", "email", "email", ["required" => true]),
                ["Комментарий", "text", "comment"]);

$form = new Form($fields);

include $mv -> views_path."main-header.php";






    
         echo $form -> displayVertical(); 
        
             echo $ajax_csrf_token; 
            
        
    


 
include $mv -> views_path."main-footer.php";

В файле media/js/utils.js пишем код на jQuery для обработки формы.

$(document).ready(function()
{
    $("#send-request").on("click", function()
    {
        $.ajax({
            type: "POST",
            dataType: "html",
            url: rootPath + "views/ajax/request.php",
            data: $("#modal-request form").serialize(),
            success: function(data)
            {
                $("#modal-request div.form-errors").remove();
                
                if(data != "done")
                    $(data).insertBefore($("#modal-request form"));
                else
                {
                    var message = "Ваш запрос был успешно отправлен.";
                    $("#modal-request form").replaceWith("" + message + "");
                }
            }
        });
    });
});

Создаем файл для обработки AJAX запроса views/ajax/request.php

//Проверяем, что запрос был отправлен через AJAX jQuery
if(!isset($_SERVER['HTTP_X_REQUESTED_WITH']))
    exit();

include "../../config/autoload.php";
$mv = new Builder();

if(!empty($_POST))
{        
    $fields = [["Имя", "char", "name", ["required" => true]),
                    ["Телефон", "phone", "phone"],
                    ["Email", "email", "email", ["required" => true]),
                    ["Комментарий", "text", "comment"]);
        
    $form = new Form($fields);

    //Токен проверяется автоматически, главное чтобы он был выведен в html форме
    $form -> useAjaxTokenCSRF();
    $form -> getDataFromPost() -> validate();
        
    if($form -> isValid())
    {
        $message = $form -> composeMessage();
        Email :: send("email@example.com", "Сообщение с сайта", $message);

        echo "done";
    }
    else
        echo $form -> displayErrors();
}

Предыдущий раздел

Форма с загрузкой файла

Следующий раздел

Вопросы и ответы