First I should say I know nothing about php and I'm trying to modify something in my site on my own. I want users to be redirected to a thank you page after they submit the contact form.I have been reading about this subject through all the other answers still I don't get it.
My html code is:
<div id="form_container">
<div id="main">
<p><small>Name</small> <input type="text" name="name" id="name" /></p>
<p><small>Email</small> <input type="text" name="email" id="email" /></p>
<p><small>Phone</small> <input type="text" name="phone" id="phone" /></p>
<p><small>Message</small> <textarea name="message" id="message" rows="12"></textarea></p>
<p><input type="submit" name="submit" id="submit" value="Email Us!" /></p>
<ul id="response" />
</div><!--end main -->
My php code is:
<?php
$name = trim($_POST['name']);
$email = $_POST['email'];
$phone = $_POST['phone'];
$message = stripslashes($_POST['message'] . "<br>Phone Number: " . $_POST['phone']);
$site_owners_email = 'xxxxxxx'; // Replace this with your own email address
$site_owners_name = 'xxxxxxxxx'; // replace with your name
if (strlen($name) < 2) {
$error['name'] = "Your name is.....";
}
if (!preg_match('/^[a-z0-9&\'\.\-_\+]+@[a-z0-9\-]+\.([a-z0-9\-]+\.)*+[a-z]{2}/is', $email)) {
$error['email'] = "Invalid email address";
}
if (strlen($phone) < 10) {
$error['phone'] = "Your phone number?";
}
if (strlen($message) < 5) {
$error['message'] = "Your message?";
}
if (!$error) {
require_once('phpMailer/class.phpmailer.php');
$mail = new PHPMailer();
$mail->From = $email;
$mail->FromName = $name;
$mail->Subject = "Website Contact Form";
$mail->AddAddress($site_owners_email, $site_owners_name);
$mail->AddAddress('xxxxxxxxxx', 'xxxxxxxx');
$mail->Body = $message
$mail->Send();
echo "<li class='success'> Congratulations, " . $name . ". We received your message</li>";
} # end if no error
else {
$response = (isset($error['name'])) ? "<li>" . $error['name'] . "</li>
" : null;
$response .= (isset($error['email'])) ? "<li>" . $error['email'] . "</li>
" : null;
$response .= (isset($error['phone'])) ? "<li>" . $error['phone'] . "</li>
" : null;
$response .= (isset($error['message'])) ? "<li>" . $error['message'] . "</li>" : null;
echo $response;
} # end if there was an error sending
?>
My js file is
$(function() {
var paraTag = $('input#submit').parent('p');
$(paraTag).children('input').remove();
$(paraTag).append('<input type="button" name="submit" id="submit" value="Email Us Now!" />');
$('#main input#submit').click(function() {
$('#main').append('<img src="img/ajax-loader.gif" class="loaderIcon" alt="Loading..." />');
var name = $('input#name').val();
var email = $('input#email').val();
var phone = $('input#phone').val();
var message = $('textarea#message').val();
$.ajax({
type: 'post',
url: 'sendEmail.php',
data: 'name=' + name + '&email=' + email + '&phone=' = phone + '&comments=' + comments,
success: function(results) {
$('#main img.loaderIcon').fadeOut(1000);
$('#response').html(results);
}
}); // end ajax
});
});
All I want is users to see a simple thank you page after they fill out the form.
Assuming the PHP code is invoked using AJAX, you could add this line to the success part of the AJAX request.
window.location.href = '/path/to/your/thankyou/page.html';
only if the results from the sendEmail.php page suggests the message was sent. One way to do this is to make the sendEmail.php echo "OK" only if the message was sent. Then you can do something like this:
success: function(results) {
$('#main img.loaderIcon').fadeOut(1000);
if (results == "OK") {
window.location.href = '/path/to/your/thankyou/page.html';
}
}
To make sendEmail.php only return "OK" if a message was sent, change this line:
echo "<li class='success'> Congratulations, " . $name . ". We received your message</li>";
with this:
echo "OK";
If the form is validated correctly in php and no errors are found, you need to add this line of code to php
echo "<script>window.location="http://www.location.com/other.htm"</script>";
so that this string is returned on successful submission of form to the ajax function and on execution the user will be redirected to the next location.