-1

I have a sign in form. When user enter wrong password or email the the php code is checking it and the ajax gives him an alert some div id width some fade effect.

but the issue is that when the user put the right email and password i need him to redirect to the index page, instead it shows me the index page inside the fade effect div.

How do i redirect the user to the index page ?

Html code:

<form action="./sign_in.php" method="post" id="form_sign_in">
       <input type="text" name="sign_in_email" id="sign_in_email">
       <input type="text" name="sign_in_pass" id="sign_in_pass">
       <input type="submit" name="connect" id="connect" value="Go">
</form>

Sign in function:

function sign_in_func($user_email, $user_pass) {

$user_email = mysql_real_escape_string($user_email);
$user_pass = mysql_real_escape_string($user_pass);

$query = "SELECT user_id FROM users WHERE user_email = '{$user_email}' AND user_pass = '{$user_pass}' limit 1";

$result = mysql_query($query);
$count = mysql_num_rows($result);

if ($count == 1) {

    while ($row = mysql_fetch_array($result)) {

        $_SESSION['user_id'] = $row['user_id'];

        return TRUE;
    }
} else {

    return FALSE;
}

sign is php code:

if (isset($_GET['sign_in_email']) && !empty($_GET['sign_in_email'])) {

    $user_email = $_GET['sign_in_email'];
} else {

    echo 'Email is required <br>';

}

if (isset($_GET['sign_in_pass']) && !empty($_GET['sign_in_pass'])) {

    $user_pass = $_GET['sign_in_pass'];
} else {

    echo 'Pass is required <br>';
}


if (isset($_GET['sign_in_email']) && !empty($_GET['sign_in_email']) && isset($_GET['sign_in_pass']) && !empty($_GET['sign_in_pass'])) {

    if (sign_in_func($user_email, $user_pass)) {

        header("location: ../../index.php");
    } else {

        echo 'Wrong email or password';
    }
}

The ajax code

$('#form_sign_in').submit(function(){

var sign_in_email = $('#sign_in_email').val();
var sign_in_pass = $('#sign_in_pass').val();

$.ajax({
    url: 'scripts/php/sign_in.php',
    data: { sign_in_email: sign_in_email, sign_in_pass: sign_in_pass },
    success: function(data){
        $('#signInFeedback').html(data);

        $('#signInFeedback').fadeIn('slow', function(){
            $('#signInFeedback').fadeOut(5000);
        });

    }
});
return false;

});

Gilad Adar
  • 167
  • 1
  • 14
  • 1
    possible duplicate of [How can I make a redirect page in jQuery/JavaScript?](http://stackoverflow.com/questions/503093/how-can-i-make-a-redirect-page-in-jquery-javascript) – Jay Blanchard Oct 17 '14 at 21:52

1 Answers1

1

In PHP you can have an array with a success key set to true and an html key set to whatever you would display if success was not true, and then you can echo the JSON encoding, and parse it when it returns to your JS code.

Example:

//at top of code
$ret = [];

if (isset($_GET['sign_in_email']) && !empty($_GET['sign_in_email']) && isset($_GET['sign_in_pass']) && !empty($_GET['sign_in_pass'])) {
    if (sign_in_func($user_email, $user_pass)) {
        $ret['success'] = true;
    } else {
        $ret['success'] = false;
        $ret['html'] = 'Wrong email or password';
    }
}
echo json_encode($ret);

Then, in your JS:

success: function(data){
    var jsonData = JSON.parse(data);
    if(jsonData.success)
        window.location = 'your_redirect_url.php';
    else{
        $('#signInFeedback').html(jsonData.html);

        $('#signInFeedback').fadeIn('slow', function(){
            $('#signInFeedback').fadeOut(5000);
        });
    }

}
Ryan Willis
  • 624
  • 3
  • 13