current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Join the Stack Overflow Community
Stack Overflow is a community of 6.5 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up
up vote 10 down vote favorite
1

The following $http request executes successfully, yet the PHP script on the other end receives an empty $_POST array when it should receive 'test' and 'testval.' Any ideas?

$http({
    url: 'backend.php',
    method: "POST",
    data: {'test': 'testval'},
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
    }).success(function (data, status, headers, config) {
    console.log(data);

    }).error(function (data, status, headers, config) {});
share|improve this question
up vote 13 down vote accepted

If you wan to send just that simple data, try this:

$http({
    url: 'backend.php',
    method: "POST",
    data: 'test=' + testval,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
    }).success(function (data, status, headers, config) {
        console.log(data);

    }).error(function (data, status, headers, config) {});

And php part shoul be like this:

<?php
    $data = $_POST['test'];
    $echo $data;
?>

It is working for me.

share|improve this answer
    
I was hoping you could take a look at stackoverflow.com/questions/34480438/… ? The problem I'm encountering is similar but has some distinct differences from the one posted in this thread. – Zypps987 Dec 27 '15 at 18:20
    
Thanks. I was using the examples at docs.angularjs.org/api/ng/service/$http under Shortcut methods: $http.get('/someUrl', config).then(successCallback, errorCallback); $http.post('/someUrl', data, config).then(successCallback, errorCallback); The top answer on this question explains it well: stackoverflow.com/questions/19254029/… – Gabri Botha Sep 7 at 14:42
up vote 7 down vote

This is a common issue with AngularJS.

The first step is to change the default content-type header for POST request:

$http.defaults.headers.post["Content-Type"] = 
    "application/x-www-form-urlencoded; charset=UTF-8;";

Then, using an XHR request interceptor, it is necessary to serialize properly the payload object:

$httpProvider.interceptors.push(['$q', function($q) {
    return {
        request: function(config) {
            if (config.data && typeof config.data === 'object') {
                // Check https://gist.github.com/brunoscopelliti/7492579 
                // for a possible way to implement the serialize function.
                config.data = serialize(config.data);
            }
            return config || $q.when(config);
        }
    };
}]);

In this way, payload data will be again available in the $_POST array.

For more info about XHR interceptor.

Another possibility, it is to mantain the default content-type header, and then server side parse the payload:

if(stripos($_SERVER["CONTENT_TYPE"], "application/json") === 0) {
    $_POST = json_decode(file_get_contents("php://input"), true);
}
share|improve this answer
up vote 5 down vote

More simplified way: 

myApp.config(function($httpProvider) {
    $httpProvider.defaults.transformRequest = function(data) {        
        if (data === undefined) { return data; } 
        return $.param(data);
    };
    $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8'; 
});
share|improve this answer
2  
I was already cursing Angular but you gave me belief. – Andrew Best Jun 28 at 18:58
up vote 3 down vote

Remove the following line, and the preceding comma:

headers: {'Content-Type': 'application/x-www-form-urlencoded'}

And then the data will appear in $_POST. You only need that line if you are uploading a file, in which case you'll have to decode the body to get the data vars.

share|improve this answer
    
Thanks for your response. Unfortunately, I removed the line but didn't have any luck. The print_r($_POST) command in my PHP script is still returning an empty array. – hawkharris Oct 6 '13 at 21:07
up vote 2 down vote

I found my solution here http://www.peterbe.com/plog/what-stumped-me-about-angularjs. There is a piece of code in the "AJAX doesn't work like jQuery" section, which solved my problem.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.