使用AJAX重定向

Question

JQUERY

$('#myform').submit(function() 
{
        $.ajax(
        {
            type: "POST",
            url: 'checkit.php',
            data: 
            {
                usernameuser: $("#usernameuser").val(),
                passworduser: $("#passworduser").val()
            },
            success: function(html)
            {
                $(".gonewrong").html(""); 
                $(".gonewrong").show();
                $(".gonewrong").append(html);
            }
        });
    });
});

LOGIN FORM

            <form name="loginform" action="checkit.php" method="post" accept-charset="utf-8" id="myform">  
                <table class="logintable">
                <tr class="logintr"><td class="mylabel">Username </td><td class="myinputfield"><input type="text" name="usernameuser" id="usernameuser"/></td></tr>
                <tr class="logintr"><td class="mylabel">Password </td><td class="myinputfield"><input type="password" name="passworduser" id="passworduser"/></td></tr>
                <tr class="logintrbutton"><td class="mylabel">&nbsp; </td><td class="mybutton"><input type="submit" value="LOGIN" class="loginbutton" id="loginuser"/></td></tr>
                <tr><td class="gonewrong" colspan="3"></td></tr>
                </table>
            </form>

CHECKIT.PHP

if ($numUsers>0) 
{
    session_start();
    $_SESSION['username'] = $username;
    header("Location: good.php");
} 
else 
{
    echo 'Incorrect username/password';
}

If the login is wrong everything works fine, the message error is displayed in the right place but if the login was successful it doesn't redirect me to good.php in the address bar of the browser but i see that page (good.php) inside gonewrong.

I spent many hours on this and can't solve it.

Answer 1

You're trying to redirect backend app, where the ajax is call. You should redirect the front-page, where the javascript is.

PHP: (backend app, can't redirect here)

if ($numUsers>0) 
{
    session_start();
    $_SESSION['username'] = $username;
    //  header("Location: good.php"); - this not gonna work
    //  echo success instead:
    echo 'success';
} 
else 
{
    echo 'Incorrect username/password';
}

SCRIPT: (front page, make redirection here)

$('#myform').submit(function(e) 
{
    e.preventDefault();
    $.ajax(
    {
        type: "POST",
        url: 'checkit.php',
        data: 
        {
            usernameuser: $("#usernameuser").val(),
            passworduser: $("#passworduser").val()
        },
        success: function(status)
        {
           // check if successfully logged in:
           if('success'==status){
               //Success! user is logged in, need to redirect to good.php
               window.location.href='http://yoursite.com/good.php';
           }else{
               // Error! user is not logged in, show error message:
               $(".gonewrong").html(""); 
               $(".gonewrong").show();
               $(".gonewrong").append(status);
           }
        }
     });
  });
});