[RESOLVED] Trying to display message in <form> without refreshing page?

Hi,

I have a contact form on my page that sends an email. I have a <label> tag that will contain a message, be it successful or an error in the form. The problem I'm having is that my script is a PHP script to send the mail. I want to be able to click "submit" and then have the message immediately appear in the form without refreshing the page. Not sure how to do that. Below is my HTML and PHP code:

Code:

---

    <div id="p2" class="boxes">
        <div id="contactMe" class="mainDiv">
            <h1>Contact Form</h1>
            <br>
            <form id="contact-form" action="scripts/mail3.php" method="POST">
                <label id="user-message"></label>
                <br>
                <label for="fullname">Full Name</label>
                <br>
                <input id="txtName" type="text" name="txtName">
                <br>
                <br>
                <br>

                <label for="email">E-Mail</label>
                <br>
                <input id="txtEmail" type="text" name="txtEmail">
                <br>
                <br>
                <br>

                <label for="message">Message</label>
                <br>
                <textarea id="txtMessage" rows="3" cols="50" name="txtMessage"></textarea>

                <button id="mail-submit" type="submit" name="submit">Send E-Mail</button>

                <p class="form-message"></p>
            </form>
        </div>

        <div class="backToTop"><a href="#theTop">Back to Top</a></div>
    </div>

---

Here is the PHP code:

Code:

---

<?php
    session_start();

    $message = $to = $from_email = "";
    $to = "[email protected]";

    if (empty($_POST["txtEmail"])) {
        $emailErr = "Email is required";
    }
    else {
        $from_email = $_POST["txtEmail"];

        // check if e-mail address is well-formed
        if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
            $emailErr = "Invalid email format";
        }
    }


    if (empty($_POST["txtMessage"])) {
        $emailErr = "Message is required";
    }
    else {
        $message = $_POST["txtMessage"];
    }

    $subject = "* * * Email Inquiry * * *";

    // compose headers
    $headers = "From: [email protected]\r\n";
    $headers .= "Reply-To: [email protected]\r\n";
    $headers .= "X-Mailer: PHP/".phpversion();

    $message = wordwrap($message, 70);

    // send email
    if (mail($to, $subject, $message, $headers)) {
        header('Location: http://www.something.com/#p2');   
        echo("<script>window.scrollTo({'behavior': 'auto','left': left,'top': top});;document.getElementById('user-message').innerHTML = 'Message Successfully Sent!';");
    }
    else {
        echo("Message failure!");
    }
?>

---

Hii,

You can do it through AJAX.

Code:

---

<script>
$(document).ready(function(){
$("#contact-form").on("submit", function(e){
        e.preventDefault();
    dataString = jQuery('form#contact-form').serialize();
    jQuery.ajax({
        type: "POST",
        url: "full_path/wyslij.php",
        data: dataString,
        success:  function(data)
        {
            alert('Form successfully submitted.')
        },
        error:  function(data)
        {
            alert('Form not submitted.')
        }
    });
});
});
</script>

---

Also form action should be removed:

Code:

---

<form id="contact-form" method="POST">

---

I Hope it helpfull to you...

Thanks brother....that's what I've been looking for!!!