Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise

I am using AngularJS. I would like to send multiple data in a HTTP post through AngularJS. The backend runs Cakephp and I have verified that the Rest API works through python HTTP-post.

I have this controller that looks something like this;

angular.module('myApp.controllers', []).
    controller('AlertDemoCtrl', ['$http', function($http) 
    {
        var post_url;
        var post_data;

        post_url="http://127.0.0.1/api_XXX/";

        post_data = {'data[Table1][field1]':'XX',
                     'data[Table2][0][field1]':'AA', 
                     'data[Table2][0][field2]':'BB', 
                     'data[Table2][0][field3]':'CC'
                    };

        $http.post(post_url, post_data);    
    }])

When I run the code, the page fails to load AngularJS properly. If I comment away $http.post(post_url, post_data);, the code runs normally. Where did I go wrong?

Thank you very much.

share|improve this question
    
What is your error message? Since you're sending ONE data object (regardless what it consists of) there must be another problem. Is your server reachable with this URL? – Sentenza Mar 23 '14 at 14:37
    
Yes. Server is reachable. I did a similar HTTP Post using python and it works. I cannot see the error message. I can only see that the page did not appear properly. – user3293156 Mar 23 '14 at 15:14
    
How can I view the error message? From the HTTP Post response? How to make AngularJS show the HTTP Post response? – user3293156 Mar 23 '14 at 15:26
    
take your browser's debug tools and look at the console for error messages or observe the network traffic to view the post response. – Sentenza Mar 23 '14 at 16:37
    
did it solve?????? – subhendupsingh Mar 21 '15 at 7:38
up vote 0 down vote accepted

Two things here:

First, responses to $http requests are handled via Promises in AngularJS. If you are planning to do something with the response returned by the server, you should try adding Promise handling to your code. From the official AngularJS docs (v1.3.0)

// Simple POST request example (passing data) :
$http.post(post_url, post_data).
  success(function(data, status, headers, config) {
    // this callback will be called asynchronously
    // when the response is available
  }).
  error(function(data, status, headers, config) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });

Second, you could try encapsulating your $http call within a function, and then call that function on an event, once the entire AngularJS for the page is loaded.

angular.module('myApp.controllers', []).
controller('AlertDemoCtrl', ['$http', function($http) 
{
    var post_url;
    var post_data;

    post_url="http://127.0.0.1/api_XXX/";

    post_data = {'data[Table1][field1]':'XX',
                 'data[Table2][0][field1]':'AA', 
                 'data[Table2][0][field2]':'BB', 
                 'data[Table2][0][field3]':'CC'
                };

    $scope.fetch = function() {
        $http.post(post_url, post_data).success(function() {
            // handle response here
        }).error(function() {
            // handle error here
        });    
    }
}])
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.