Ajax data doesn't make it to $_POST array

Question

I'm sorry if this question has already been asked but none of the other answer to the other questions have helped me solve my problem.

I am writing a user login procedure that uses an .ajax() call to my login.php file to the log the user in. However, after several hours of debugging, I seem to have found out that the problem is that the data: {user: username, pass: password}line in my ajax call does not seem to send the data to my $_POST array in login.php. In fact, it won't even echo out my if statement in login.php. I know this problem sounds similar to others, but I have literally tried everything on this site that's related to the topic with no luck whatsoever.

Here's login_form.php. It contains the .ajax() code at the bottom:

<!DOCTYPE html>
<html>
    <head>
        <title>Login Form</title>
        <link rel="stylesheet" type="text/css" href="css/custom-style.css" media="screen">
    </head>
    <body>
        <div id="login_container">
            <img src="img/sflogo.gif" alt="Sutton Ferneries" id="sflogo_login">
            <p id="add_err">We're sorry, we weren't able to find that username/password.</p>
            <input type="text" name="username" id="username" placeholder="Username">
            <input type="password" name="password" id="password" placeholder="Password">
            <p id="learn_login">Want to know the benefits of having an online account with us? <a href="#">Learn More.</a></p>
            <button id="login_btn">Log In</button>
        </div>
    </body>


<script type="text/javascript">

    $(document).ready(function() {
        $("#add_err").css('display', 'none', 'important');
        $("#login_btn").on("click", function(e) {

            e.preventDefault();
            var username = $("#username").val();
            var password = document.getElementById("password");
            password = password.value;

            $.ajax({
                url: "login.php",
                data: { user: username, pass: password },
                type: "POST",
                dataType: "json",
                beforeSend: function() {
                    $("#add_err").css('display', 'block', 'important');
                    $("#add_err").html("Loading...");
                },
                success: function(data) {
                document.write(data);
                    if (data == 'true') {
                        $("#login_container").html(data);
                        //closeLightbox();
                        window.location = "index.php";
                    } else {
                        $("#add_err").css('display', 'block', 'important');
                        $("#add_err").html("Wrong username or password.");
                    }
                }
            });
        });
    });

</script>
</html>

And here's login.php:

<?php

    header("Content-Type: application/json, true");

    if (!isset($_POST)) {
        echo 'Post is null';
    } else {
        echo 'Everything seems to be okay.';
    }

    $username = $_POST['user'];
    $password = $_POST['pass'];

?>

dataType: "json", - you are expecting/trying to send json type and data but echoing text/html from server. please try something like echo json_encode('Post is null'); — Tapos
– Tapos, Commented Sep 18, 2014 at 7:05
I just gave this a whirl, too, with no luck. It's not sending any data to the success: call. — Graham S.
– Graham S., Commented Sep 18, 2014 at 7:15

Rakesh Sharma · Accepted Answer · 2014-09-18 07:15:04Z

1

Remove

dataType: "json",

and

header("Content-Type: application/json, true");

and you will get result if you don't want to remove return back a json result and decode in success part and show them

answered Sep 18, 2014 at 7:15

Rakesh Sharma

13.7k5 gold badges41 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Graham S. Over a year ago

Thank you. This worked for me. Man, do I feel relieved. Thank you SO!

Yatin Mistry · Accepted Answer · 2014-09-18 07:07:58Z

0

Your code is working perfect try to print the data

    echo   $username = $_POST['user'];

    echo $password = $_POST['pass'];

answered Sep 18, 2014 at 7:07

Yatin Mistry

1,2642 gold badges13 silver badges36 bronze badges

2 Comments

Graham S. Over a year ago

Just tried this and still no luck. I'm not sure what exactly what is happening, because I'm getting up to my beforeSend: call, but it never seems to call success:. Good to know it's working for you though, I'm going to keep playing around to see if it's something else in my code.

Yatin Mistry Over a year ago

Remove all code add above two line only in login.php file

Shafeeque · Accepted Answer · 2014-09-18 07:14:37Z

0

You are using json in ajax. So the output should be something like this.

$output['msg'] = 'Here is your return';

echo json_encode($output);

Try this in login.php

In js you will get return as

alert(data.msg);

answered Sep 18, 2014 at 7:14

Shafeeque

2,0692 gold badges13 silver badges28 bronze badges

Comments

Ritesh · Accepted Answer · 2014-09-18 07:31:55Z

0

You have not included the Jquery min file in your code :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

and why you are getting username through jquery method and password through javascript method..?? get it like this :

var username = $("#username").val();
var password = $("#password").val();

I've just made the above changes and everything worked fine..!!

answered Sep 18, 2014 at 7:31

Ritesh

4,9987 gold badges34 silver badges43 bronze badges

Collectives™ on Stack Overflow

Ajax data doesn't make it to $_POST array

4 Answers 4

1 Comment

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related