CODEWITHSUNDEEP
javascriptangularjs
Rajib Deka
Rajib Deka

Reputation: 551

angularjs $http post is not sending data

I am little bit frustrated with my below angular code, as it is not sending the JSON data to my spring boot based micro-service running in the same machine. Please help me out! FYI, I am a newbie to JavaScript world. 

$scope.addBook = function() {
    var data = $.param({
        json: JSON.stringify({
            name: $scope.bookName,
            isbn: $scope.isbn,
            author: $scope.authorName,
            pages: $scope.pages
        })
    });

    var config = {
        headers : {
            'Content-Type': 'application/json'
        }
    }

    var result = $http.post('http://localhost:8080/book', data, config);
    result.success(function (data, status, headers, config) {
        $scope.result = JSON.stringify({data: data});
    });
    result.error(function (data, status, header, config) {
        $scope.result = JSON.stringify({data: data});
    });
};

Upvotes: 2

Views: 3784

Answers (4)

nweg
nweg

Reputation: 2865

Just pass your data object like this: 

$scope.addBook = function() {
        var data = 
            {
                name: $scope.bookName,
                isbn: $scope.isbn,
                author: $scope.authorName,
                pages: $scope.page
        };

        var config = {
            headers : {
                'Content-Type': 'application/json'
            }
        };

        var result = $http.post('http://localhost:8080/book', data, config);
        result.success(function (data, status, headers, config) {
            $scope.result = JSON.stringify({data: data});
        });
        result.error(function (data, status, header, config) {
            $scope.result = JSON.stringify({data: data});
        });
    };

You don't need to stringify it. You probably can remove the stringify form the result you get too if your service is returning JSON.

Upvotes: 1

amanpurohit
amanpurohit

Reputation: 1296

Change your data to the following. It should work

var data = $.param({
                'name': $scope.bookName,
                'isbn': $scope.isbn,
                'author': $scope.authorName,
                'pages': $scope.pages
        });

Upvotes: 0

Matthias
Matthias

Reputation: 928

I think $http does not send stingifyed data.

Try

$scope.addBook = function() {
    var data = {
            name: $scope.bookName,
            isbn: $scope.isbn,
            author: $scope.authorName,
            pages: $scope.pages
        };

    $http.post('http://localhost:8080/book', data)
        .success(function (data, status, headers, config) {
            $scope.result = JSON.stringify({data: data});
        })
        .result.error(function (data, status, header, config) {
            $scope.result = JSON.stringify({data: data});
        });
};

Upvotes: 0

Prashant
Prashant

Reputation: 8060

You don't need to run JSON.stringify or $.param, just pass the object directly to $http.post(). Angular creates the JSON for you.

Upvotes: 3

Related Questions