Header ('location: Page.html'); Not Working, When Form Submitting By Ajax

- 1 answer

I'm getting no errors, but when submit is hit, form is cleared, email is sent but no redirection happens. I have also tried to redirect using script, with now luck.

Form Page


      //Prevent the default form action

function validateEmail($email2) {
 var emailReg = /^([\w-\.][email protected]([\w-]+\.)+[\w-]{2,4})?$/;
 if( !emailReg.test( $email2 ) ) {
    return false;
   } else {
    return true;
    var thisForm = $(this);


    var errors = false;

    var email2 = $("input[id='email2']").val();
    var firstname2 = $("input[id='firstnam2e']").val();
    var lastname2 = $("input[id='lastname2']").val();
    var phone2 = $("input[id='phone2']").val();
    var business = $("input[id='business']").val();
    var nbusiness = $("input[id='nbusiness']").val();
    var message2 = $("textarea[id='message2']").val();

    if(( !validateEmail(email2)) || (email2=="")) {
     errors = true; 



    if(firstname2=="") {
     errors = true; 


    if(lastname2=="") {
     errors = true; 


    if(business=="") {
     errors = true; 


     if(phone2=="") {
     errors = true; 


    if(errors == false){

    //Hide the form
      //Display the "loading" message
        //Post the form to the send script
          type: 'POST',
          url: thisForm.attr("action"),
          data: thisForm.serialize(),
          //Wait for a successful response
          success: function(data){
            //Hide the "loading" message
              //Display the "success" message



I have a whole whack form inputs here, followed by:

<div class="contactRow" style="height:160px; margin-top:91px;">
<textarea name='message2' id="message2" rows="8" cols="38" placeholder="Comments"></textarea>   </div>
 <div class="contactRow"><center><input type="checkbox" name="I-agree" required>I agree to the<a   target="_blank" rel="nofollow noreferrer" href="" target="_blank">Terms and Conditons</a></input>  </center><div class="contactSubmit"><input type='submit' value="Submit"></div></div>

seperate.php page to send off email

if (isset($_POST['email2']))
//if "email" is filled out, send email
//send email
$email2 = $_POST['email2'] ;
$firstname2 = $_POST['firstname2'] ;
$lastname2 = $_POST['lastname2'] ;
$nbusiness = $_POST['nbusiness'] ;
$phone2 = $_POST['phone2'] ;
$business = $_POST['business'] ;
$message2 = $_POST['message2'] ;

$sizeof2 = $_POST['sizeof2'] ;
$whattype2 = $_POST['whattype2'] ;
$whoare2 = $_POST['whoare2'] ;
$wheredid2 = $_POST['wheredid2'] ;

$comment2 = "$message2 \n\n $firstname2 \n $lastname2 \n $phone2 \n $business \n $nbusiness \n     $email2 \n $sizeof2 \n $whattype2 \n $whoare2  \n $wheredid2 \n\n";

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

$headers2 = 'From: '.$email2."\r\n" .
    'Reply-To: '.$email2."\r\n" .
    'X-Mailer: PHP/' . phpversion();

//[email protected]
mail("[email protected]",  "-------------: ".$firstname2, $comment2, $headers2);
header ('Location: thankyou.html');
exit ();
echo "There was a problem with the registration";


Since your form submit results in an AJAX request, you should redirect upon successful completion of that request.

  type: 'POST',
  // Wait for a successful response
  success: function(data) {
      window.location.href = "thankyou.html"; // <-- REDIRECT HERE

You can also use window.location.replace("thankyou.html"); if you do not wish put the originating page in the session history.

In you php you should probably replace the header ('Location: thankyou.html'); with code returning a message or whatever you want to the AJAX request (e.g. echo "Success!";).