CODEWITHSUNDEEP
phpjqueryhtmlajax
Jay Viluan
Jay Viluan

Reputation: 1681

How to redirect page after the jquery ajax is call?

This is my Login form code. My problem is after the statement is true. Is will not be redirect to the home page instead it's just show the home page at my index page.

How to Redirect jquery ajax at the other page after the statement is true?

HTML Code 

<form id="myForm" class="form-group" method="post" action="actions/login_check.php">    
    <div id="result"></div> 
    <table class="table-condensed" >
        <tr><br>
          <td><input type="text" name="username" class="form-control" autofocus="autofocus" placeholder="Username" size="40"></td>
        </tr>
        <tr>
            <td><input type="password" name="password" placeholder="Password" class="form-control"></td>
        </tr>
        <tr>
            <td><button id="submit" class="btn btn-primary form-control">Sign In</button></td>
        </tr>
        <tr>
            <td align="right" style="font-size:14px;"><a href="forgot_password.php">Forgot Password?</a></td>
        </tr>
    </table>
</form>

PHP code

$username = mysqli_real_escape_string($con,$_POST['username']);
$password = mysqli_real_escape_string($con,sha1($_POST['password']));
$empty = "da39a3ee5e6b4b0d3255bfef95601890afd80709";

$query = mysqli_query($con,"SELECT * FROM users WHERE username = '".$username."' AND password = '".$password."'");
$row = mysqli_num_rows($query);
$getUser = mysqli_fetch_array($query);


if(empty($username) or $password == $empty)
    echo "Invalid Email or Password";
elseif($username == $getUser['username'] and $password ==  $getUser['password']){
    session_start();
    $_SESSION['username'] = $username;
    $online = "UPDATE users SET active = 1 WHERE username = '".$username."'";
    mysqli_query($con,$online);
    header("Location: ../home.php");
    $_SESSION['timestamp'] = time();
}else
    echo "Invalid Email or Password";

jQuery Ajax

    $("button#submit").click(function(){

    if( $("#username").val == "" || $("#password").val == "")
        $("div#result").html("Please enter username and password");
    else
        $.post( $("#myForm").attr("action"),
            $("#myForm :input").serializeArray(),
            function(data) {
                $("div#result").html(data);
            }
         );

         $("#myForm").submit(function(){
            return false;
         });
});

Upvotes: 1

Views: 1522

Answers (4)

Dostonbek Oripjonov
Dostonbek Oripjonov

Reputation: 1674

Just try window.location 

success: function (response) {
               if (response.d == true) {
                    window.location = "directed_page";
                }
            },

or try to use 

window.location.replace()

Upvotes: 0

Nasir Ul Islam Butt
Nasir Ul Islam Butt

Reputation: 121

There are plently of options.
1) You can assign window.location.href the URL which you want to redirect. But there is a problem.

  • Using ajax, data loads asynchronously, so there might be cases when the page redirects in between the ajax response.
    • To overcome this problem, use .done() method to redirect when the ajax is finished. Inside that done() method, pass an anonymous function, and use window.location.href inside it.
    2) You can also use .load() method which is also the short hand for .ajax() to perform page load without the page refresh which gives user a sense of redirection. So its your choice. Pick any one!

    Upvotes: 0

    Pedro Lobito
    Pedro Lobito

    Reputation: 98861

    As of jQuery 1.8, you can use .done to redirect the user after a successful jquery .post.

      .done(function() {
    window.location.href='http://www.successpage.com'; 
  })

    i.e.:

    $("button#submit").click(function(){

if( $("#username").val == "" || $("#password").val == "")
    $("div#result").html("Please enter username and password");
else
    $.post( $("#myForm").attr("action"),
        $("#myForm :input").serializeArray(),
        function(data) {
            $("div#result").html(data);
        }).done(function() {
    window.location.href='http://www.successpage.com'; 
  });

     $("#myForm").submit(function(){
        return false;
     });

});

    Upvotes: 0

    magegaga.com
    magegaga.com

    Reputation: 500

    In the POST response, you can use window.location.href

    function(data) {
    $("div#result").html(data);
    window.location.href=<homepageurl> 
}

    Upvotes: 2

    Related Questions