javascript - ajax form redirect after submit - Stack Overflow

admin管理员组

文章数量:1355570

Hello there i'm having problem with redirection after form has been submit. I'm using simple ajax form for displaying login errors in a div.

$(document).ready(function(){
$('#formlogin').on('submit', function (e) {

    $.ajax({
        type: 'POST', 
        url: 'login.php',
        data: $(this).serialize(),
        success: function(data) {
        $('div#ack').empty().append(data);

        } 

    });

    e.preventDefault();
});

The problem is after submit success it doesn't redirect to "logged_in.php"

Here is php login.

if (empty($username) === true || empty ($password) === true)    {
    $errors [] = 'Please enter both username and password!';

} else if (user_exists($username) === false)   {
    $errors [] = 'We can not find the name. Have you registered?';
} else {

    $login = login($username, $password);
    if ($login === false)  {
        $errors [] = 'This user name or password is incorrect.';

    } else {

        $_SESSION['user_id'] = $login;
        header('Location: logged_in.php');  
        exit();

    }


}

Hello there i'm having problem with redirection after form has been submit. I'm using simple ajax form for displaying login errors in a div.

$(document).ready(function(){
$('#formlogin').on('submit', function (e) {

    $.ajax({
        type: 'POST', 
        url: 'login.php',
        data: $(this).serialize(),
        success: function(data) {
        $('div#ack').empty().append(data);

        } 

    });

    e.preventDefault();
});

The problem is after submit success it doesn't redirect to "logged_in.php"

Here is php login.

if (empty($username) === true || empty ($password) === true)    {
    $errors [] = 'Please enter both username and password!';

} else if (user_exists($username) === false)   {
    $errors [] = 'We can not find the name. Have you registered?';
} else {

    $login = login($username, $password);
    if ($login === false)  {
        $errors [] = 'This user name or password is incorrect.';

    } else {

        $_SESSION['user_id'] = $login;
        header('Location: logged_in.php');  
        exit();

    }


}

• javascript
• php
• jquery
• ajax
• forms

Share Improve this question Follow asked Jul 22, 2015 at 1:39 DemkoDemko 3311 gold badge11 silver badge44 bronze badges 1

• thanks for the code to serialize and post the form via ajax - just what i needed, oh and the code to redirect is just window.location.href = "EditItem.php?batchid=" + bid + "&quoteitemid=NEW"; – hamish Commented Nov 6, 2019 at 21:41

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 5

If you redirect a page that was called with AJAX, it will not redirect the parent page.

What you should do is echo something that identifies that the user has successfully logged in.

Maybe instead of header('Location: logged_in.php'); you put:

echo "success";

Then, in your success function:

success: function(data) {
    if (data == "success")
        window.location = "logged_in.php";
    else
        alert("Wrong password.");
}

Note that success in ajax does not mean that you have successfully logged in, just means that the request to the page returned without error (500). You still need to decide what you want to do with your data.

There are two different things here.

1 - Your AJAX function. It is on a page that call the server asynchronously

2 - Your login page. It is called by your page containing the AJAX

The code in your second page happens in the server, while your AJAX code is happening in your client.

You should return a success message in your php login page and then, in your success callback, check if the message is the correct one and that will mean the user logged in successfully. Once you check the message is the correct one, you can redirect the user from your success callback, doing: location.href = "yourUrl"

Here is some production code that works great for me, to submit the form and then redirect.

$.ajax({
        url: "QuoteReload.php",
        type: 'GET',
        data: 'batchid=' + bid + '&operation=archiveBatch',
    success: function(response) { 
                // window.location.href = "EditItem.php?batchid=" + bid + "&quoteitemid=NEW";
                $(location).attr('href', 'Quote.php?QuoteId=<?php echo $QuoteId; ?>')
            },
    error: function(xhr) {
            $(ddl).css("background-color", "#4C25BC");
            alert('Delete Batch error: ' + xhr); 
             }
});

本文标签： javascriptajax form redirect after submitStack Overflow