Форум PHP программистов > Пример кода ajax для отправки формы

[ Поиск ] - [ Пользователи ] - [ Календарь ]

Полная Версия: Пример кода ajax для отправки формы

amaiUser

1.04.2025 - 14:35

Напишите пример кода который отправлял бы форму html а php обрабатывал бы эту форму например из 2 полей и кнопки button

Valick

1.04.2025 - 14:56

index.php

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AJAX Form Example</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <h1>Отправка формы с помощью AJAX</h1>
    <form id="myForm">
        <label for="name">Имя:</label>
        <input type="text" id="name" name="name" required>
        <br><br>
        <label for="email">Email:</label>
        <input type="email" id="email" name="email" required>
        <br><br>
        <button type="submit">Отправить</button>
    </form>
    <div id="response"></div>

    <script>
        $(document).ready(function() {
            $('#myForm').on('submit', function(event) {
                event.preventDefault(); // Предотвращаем стандартное поведение формы
                $.ajax({
                    url: 'process.php', // URL для обработки формы
                    type: 'POST',
                    data: $(this).serialize(), // Сериализация данных формы
                    success: function(response) {
                        $('#response').html(response); // Выводим ответ сервера
                    },
                    error: function() {
                        $('#response').html('Произошла ошибка при отправке данных.');
                    }
                });
            });
        });
    </script>
</body>
</html>

process.php

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // Получаем данные из формы
    $name = htmlspecialchars($_POST['name']);
    $email = htmlspecialchars($_POST['email']);

    // Здесь можно добавить код для обработки данных (например, сохранить в БД)

    // Отправляем ответ
    echo "Данные успешно отправлены! Имя: $name, Email: $email";
} else {
    echo "Ошибка: неверный метод запроса.";
}
?>

Как это работает:
HTML-файл содержит форму с двумя полями: "Имя" и "Email", а также кнопку "Отправить".
При отправке формы срабатывает AJAX-запрос, который отправляет данные на process.php.
PHP-файл принимает данные, обрабатывает их (в данном случае просто выводит на экран) и отправляет ответ обратно на клиент.
Ответ отображается в элементе с ID response.

_____________
Стимулятор ~yoomoney - 41001303250491

Быстрый ответ:

Здесь расположена полная версия этой страницы.