使用AJAX在php中添加标头

Question

My question is simple, I'm using AJAX and i want to redirect the user to another page if the user fill up the registration form properly, however if the user failed to match his/her password. i want to show an error message.

here is my PHP code:

if (isset($_POST['password']) && isset($_POST['retype_password']))
{
  $password = $_POST['password'];
  $retype_password = $_POST['retype_password'];
  if(!empty($password) && !empty($retype_password))
  {
     if($password == $retype_password)
     {
       header("Location: anotherpage.php");
       exit();
     }
     else
     {
        echo 'password does not match';
     }
  }
}

here is my ajax:

var frm = $('#frm_register');
    frm.submit(function (e)
    {
        e.preventDefault();
         $.ajax({
            type: frm.attr('method'),
            url: frm.attr('action'),
            data: frm.serialize(),
            success: function (data) {
                $('#error').text(data);
            }
        });
        return false;
    });

The problem here is that it doesn't redirect to another page unless i refresh the page.

Answer 1

Instead of header("Location: anotherpage.php"); just do echo '1' and in your AJAX call, if data['responseText'] == '1' than just do a document.location.href = 'anotherpage.php'

Answer 2

JavaScript does not work with header() as it is browser-based language whereas PHP communicates directly with the Server. The best solution would probably be to return an error flag and message json_encode()'d.

If you return 0 (error) then display a message.

If you return 1 (success) redirect with JavaScript to a URL passed by php. That way you will be able to easily change the new URL should anything change in the website.

JavaScript

var frm = $('#frm_register');
    frm.submit(function (e)
    {
        e.preventDefault();
         $.ajax({
            type: frm.attr('method'),
            url: frm.attr('action'),
            dataType: 'json',
            data: frm.serialize(),
            success: function (data) {
                if (data.r == 0){
                    $('#error').text(data.m);
                }
                if (data.r == 1){
                    document.location.href = data.m;
                }
            }
        });
        return false;
    });

PHP

if (isset($_POST['password']) && isset($_POST['retype_password']))
{
  $password = $_POST['password'];
  $retype_password = $_POST['retype_password'];
  if(!empty($password) && !empty($retype_password))
  {
     if($password == $retype_password)
     {
       echo json_encode(array(
           'r' => 1,
           'm' => 'anotherpage.php'
       ));
       exit();
     }
     else
     {
       echo json_encode(array(
           'r' => 0,
           'm' => 'Passwords do not match'
       ));
       exit();
     }
  }
}

Answer 3

var frm = $('#frm_register');
    frm.submit(function (e)
    {
        e.preventDefault();
         $.ajax({
            type: frm.attr('method'),
            url: frm.attr('action'),
            data: frm.serialize(),
            success: function (data) {
              if(data) {
                winlow.location = data;
              }
            }
        });
        return false;
    });

In your action page just echo the link where you wanna redirect if you want

Answer 4

You can simply use javascript to redirect to the page like below:

if (isset($_POST['password']) && isset($_POST['retype_password']))
{
  $password = $_POST['password'];
  $retype_password = $_POST['retype_password'];
  if(!empty($password) && !empty($retype_password))
  {
     if($password == $retype_password)
     {
       echo true;
     }
     else
     {
        echo 'password does not match';
     }
  }
}

And for redirecting, you can use:

var frm = $('#frm_register');
    frm.submit(function (e)
    {
        e.preventDefault();
         $.ajax({
            type: frm.attr('method'),
            url: frm.attr('action'),
            data: frm.serialize(),
            success: function (data) {
                     if(data === true) {
                      window.location = 'Your url path here';
                     } else {
                      $('#error').text(data);
                    }
            }
        });
        return false;
    });