angularjs ajax results parse error after successfully sending data to php

Question

I have a angular app using jquery for the ajax (I made a little more progress with this issue using jquery for it over $http). I am trying to send json data to php and doing it successfully (php reads it and returns the data through the header). My problem here is $.ajax is failing to recognize a success, it fails and returns parse error for the response.

Here is my javascript:

    function loginUser() {
        var target = "../data/user.php";
        var data = {
            "userName": "me",
            "userPass": "pass",
            "action": "login"
        };


        $.ajax({
            url: target,
            type: "POST",
            data: JSON.stringify(data),
            contentType: 'application/json; charset=utf-8',
            dataType: "json",
            success: function(data) {
                console.log(data);
            }
        }).fail(function(jqXHR, textStatus) {
            alert( "Request failed: " + textStatus );
        });
    }

Here is my php:

$data = file_get_contents("php://input");
$objData = json_decode($data);
print_r($objData);

Here is the response I get in the header from php:

stdClass Object
(
    [userName] => me
    [userPass] => pass
    [action] => login
)

Thanks a lot for the help

Why are you using $.ajax use Angular's $http docs.angularjs.org/api/ng/service/$http — m.e.conroy
– m.e.conroy, Commented Aug 8, 2014 at 18:21
If you set the proper header you won't need to use php://input either. If you set the header to Content-Type: application/x-www.form-urlencoded you can just use the regular php variables ($_GET,$_POST,$_REQUEST) on the other end. If you're sending a JS object just use jQuery's param function when sending -> $.param(data) — m.e.conroy
– m.e.conroy, Commented Aug 8, 2014 at 18:27

m.e.conroy · Accepted Answer · 2014-08-08 18:36:57Z

1

function loginUser($scope,$http,$log) {
    var target = "../data/user.php";
    var data = {
        "userName": "me",
        "userPass": "pass",
        "action": "login"
    };

    $http.post(target,$.param(data),{headers:{'Content-Type':'application/x-www-form-urlencoded'}}).then(function(response){
        // success stuff here
    },function(response){
        // failed stuff here
        $log.log(response);
    });

}

Then in your PHP file you can refer to your data using the $_POST var.

$user = array(
    'username' => $_POST['userName'],
    'password' => $_POST['password'],
    'action' => $_POST['action']
);
echo json_encode($user);

OR

echo json_encode($_POST);

answered Aug 8, 2014 at 18:36

m.e.conroy

3,53828 silver badges28 bronze badges

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

2 Comments

appthat Over a year ago

Thanks a lot for the response, I got a successful response finally from angular. the only thing left now is that I cant figure out a way that angular wants to parse json. I have tried the fromJson() but couldnt break it down to individual values from it (eg. response[0].username (throws an error undefined), response.username (undefined no error))

m.e.conroy Over a year ago

Try outputting the response to the console so you can see what objects are available. You should be able to just refer to the object using dot notation just like any other JS object. If you don't see what you're looking for try outputting response.data to the console.

Mike Brant · Accepted Answer · 2014-08-08 18:39:54Z

0

That response is not valid JSON, thus you get a parse error. If the client expects JSON and you send it a PHP variable dump, it will not know how to parse it.

Frankly I don't understand what your code is supposed to be doing. It looks like you are trying to mirror back the sent data in the request.

answered Aug 8, 2014 at 18:39

Mike Brant

71.4k10 gold badges102 silver badges104 bronze badges

2 Comments

appthat Over a year ago

at the moment I am trying to get a successful communication going both ways. One step at a time.

Mike Brant Over a year ago

@user2174484 Just keep in mind if the client is expecting JSON you need to send back JSON. You could just do something like echo json_encode(array('test')); to test the response.

Daniel Filho · Accepted Answer · 2015-03-27 13:57:42Z

0

Try to use $apply() to apply jQuery ajax results on Angular scopes.

answered Mar 27, 2015 at 13:57

Daniel Filho

911 gold badge1 silver badge3 bronze badges

Collectives™ on Stack Overflow

angularjs ajax results parse error after successfully sending data to php

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest