Question

I have an html page with a php form submission, it’s very basic.. what I am looking to do is as of right now it submits, then goes to a blank page with the words “thank you” etc, but what I am looking to do is when the user submits the form, it pop up a window or lightbox that says “thank you for submitting”. How can I achieve this? Here’s the form’s html code, and the actual php code for the submit.

html code:

        <form method="post" action="includes/buy.php">
        <h2> Sizes: </h2><select name="sizes"><option value="1">1</option></select>
        <h2> Email: </h2><input type="text" name="email" />
        <input type="hidden" value="black" name="color" />
        <input  type="image" value="submit" src="images/buynow.jpg" />
        </form>

php form submission code:

<?php
if(isset($_POST['email'])) {

$email_to = " ";
$email_subject = "subject line here";


function died($error) {
echo "We're sorry, but there's errors found with the form you submitted.<br /><br />";
echo $error."<br /><br />";
echo "Please go back and fix these errors.<br /><br />";
die();
}

if(!isset($_POST['email'])) {
died('We are sorry, but there appears to be a problem with the form you submitted.');       
}

$email_from = $_POST['email']; 
$color = $_POST['color'];
$sizes = $_POST['sizes'];


$error_message = "";
$email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/';
if(!preg_match($email_exp,$email_from)) {
$error_message .= 'The Email Address you entered does not appear to be valid.<br />';
}

if(strlen($error_message) > 0) {
died($error_message);
}
$email_message = "Form details:\n\n";

function clean_string($string) {
$bad = array("content-type","bcc:","to:","cc:","href");
return str_replace($bad,"",$string);
}

$email_message .= "Email: ".clean_string($email_from)."\n";
$email_message .= "Size: ".clean_string($sizes)."\n";
$email_message .= "Color: ".clean_string($color)."\n";



// create email headers
$headers = 'From: '.$email_from."\r\n".
'Reply-To: '.$email_from."\r\n" .
'X-Mailer: PHP/' . phpversion();
@mail($email_to, $email_subject, $email_message, $headers);  
?>

<?php
}
die();
?>

Answer 1

I’d suggest you to use AJAX. Here’s an example:

HTML:

<form name="yourForm" action="">
    <input type="text" name="field1" />
    <input type="text" name="field2" />
    <input type="submit" class="formSubmit" />
</form>

JavaScript (jQuery):

$('.formSubmit').on('click', function() {
    var field1 = $('input[name=field1]').val();
    var field2 = $('input[name=field2]').val();
    $.ajax({
        type: 'POST';
        url: 'yourPHPScript.php?f1='+ field1 +'&f2='+ field2;
        success: function(result) {
            alert(result);
        }
    });
});

PHP:

// proccess the data
die('successful');

In PHP file: if something’s wrong, just die() that result and it will display an alert().