Unable to parse JSON with AngularJS

Question

I have just started with AngularJS and tried a very basic example. The webpage contains a button, on click of which I request a json from the server. But whenever, I click the button, the code executes the portion in the error function.

HTML file

<!DOCTYPE html>
<head>
    <title> step 4</title>
</head>

<body ng-app="step4App">
    <div ng-controller="FriendsCtrl">

        <button ng-click="loadFriends()">Load Friends</button>
    </div>

    <script src="angular.min.js"></script>
    <script src="xml2json.js"></script>
    <script src = "step4.js"></script>
</body>
</html>

JS

var app = angular.module("step4App",[]);

app.controller("FriendsCtrl", function($scope,$http) {
    $scope.loadFriends = function(){



        $http({method:'GET',url:'http://localhost:8080/test.jsp', params:{name:"abc",no:"LBF1151638"}}).success(function(data) {
            $scope.friends = data;
            document.write('<p>two</p>');
            document.write(data);
        }).error(function() {

            alert("error");
            });
            }

});

The jsp page as of now is returning this json response.

{"response":{"numFound":0,"start":0,"docs":[]}}

But I am not able to understand, why it always executes the error function.

I checked in the browser Console that a request is being made and a 47byte response is received (equal to the no of characters in the JSON). But it doesn't print the JSON.

Christophe L · Accepted Answer · 2014-02-24 01:06:05Z

There could be something wrong happening on the server. Try opening the page with FireFox + Firebug and inspect the server response to make sure it's what you expect (check the status code and the Content-Type response header).

You can also run from a command line do a curl -v http://localhost:8080/test.jsp.

BTW Angular passes you extra parameters in the callbacks. Try alert-ing them too see what they are. From http://docs.angularjs.org/api/ng/service/$http:

$http({method: 'GET', url: '/someUrl'}).
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.
});

thanks. I tried using firebug. It says status as 200(OK), but angularJS says 404.
You probably want to check the logic in you JSP file, something could be off. Or make sure you don't have a typo in your URL.

Collectives™ on Stack Overflow

Unable to parse JSON with AngularJS

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related