How can AJAX be used to submit a form in PHP to avoid page reloading and maintain the current position on the page?

When submitting a form in PHP using AJAX, you can prevent the page from reloading by sending the form data asynchronously to the server. This allows you to maintain the current position on the page without disrupting the user experience. To achieve this, you can use JavaScript to capture the form submission event, serialize the form data, and send it to the server using an AJAX request. 

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // Process form data here
    $name = $_POST['name'];
    $email = $_POST['email'];
    
    // Return a response (e.g., success message)
    echo "Form submitted successfully!";
    exit;
}
?>
<!DOCTYPE html>
<html>
<head>
    <title>AJAX Form Submission</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <form id="myForm">
        <input type="text" name="name" placeholder="Name">
        <input type="email" name="email" placeholder="Email">
        <button type="submit">Submit</button>
    </form>

    <script>
        $(document).ready(function() {
            $('#myForm').submit(function(e) {
                e.preventDefault();
                $.ajax({
                    type: 'POST',
                    url: 'your_php_script.php',
                    data: $('#myForm').serialize(),
                    success: function(response) {
                        alert(response);
                    }
                });
            });
        });
    </script>
</body>
</html>

Keywords

AJAX form submission PHP page reloading current position

Related Questions