Отправка формы без перезагрузки страницы

Ajax отправка формы без перезагрузки страницы – это один из самых простых и надежных способов отправки HTML формы на PHP обработчик.

1. На страницу с формой обязательно подключаем библиотеку jQuery:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

2. Добавляем HTML – код формы на страницу:

<form method="POST" id="myform" action="javascript:void(null);" onsubmit="sendform()">
    <input type="email" name="email" placeholder="Ваш email : " required>
    <input type="submit" value="Отправить">      
    <div id="status"></div>
</form>

3. Перед формой добавляем следующий JavaScript:

<script>
        function sendform()  { 
            var msg   = jQuery('#myform').serialize(); // ID формы
            jQuery.ajax({    
            method: 'POST', // Метод отправки
            url: 'send.php', // Адрес обработчика
            beforeSend: function(){
                jQuery('#status').html('Отправляю...'); // Промежуточный статус
            },
            data: msg,
            cache: false,  
            success: function(html){  

            jQuery('#status').html(html);  }  });  // Вывод ответа
        } 
</script>

4. Создаем обработчик send.php:

<?
    echo "Ваш e-mail: ".$_POST['email'];
?>

Это самая простая и надежная форма для отправки сообщений без перезагрузки страницы.

Если у вас возникли сложности с отправкой сообщений без перезагрузки, пишите в комментариях или мне в телеграм.

2 комментариев
Добавить комментарий

Ваш адрес email не будет опубликован.