What are some best practices for displaying success messages in PHP forms without opening a new page?

When submitting a form in PHP, it is common to display success messages to the user without redirecting them to a new page. One way to achieve this is by using AJAX to send the form data asynchronously and update the success message dynamically on the same page. 

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // Process form data here

    // Display success message
    echo "<div class='success-message'>Form submitted successfully!</div>";
}
?>

<form id="myForm" method="post">
    <!-- Form fields go here -->
    <input type="submit" value="Submit">
</form>

<script>
document.getElementById("myForm").addEventListener("submit", function(event) {
    event.preventDefault();
    
    var formData = new FormData(this);
    
    fetch("process_form.php", {
        method: "POST",
        body: formData
    })
    .then(response => response.text())
    .then(data => {
        document.getElementById("myForm").innerHTML = data;
    });
});
</script>

Keywords

PHP form submission success message AJAX DOM manipulation

Related Questions