AngularJS $http.post not getting JSON success response. Instead redirects to URL of the REST endpoint

Question

Experiencing an issue with AngularJS $http.post. After completing the post requests, the form instead of returning the JSON response, it instead redirects to 127.0.0.1:8000/api/forms/create. The backend response is done with Django Rest Framework. This is a CORs request. The angularJS form is hosted on port 9000 making a call to port 8000. When the server is turned off, instead of returning the error alert, it insteads returns a page not found and the url is once again redirected to 127.0.0.1:8000/api/forms/create. Appreciate any advice.

Below is the controller code for Angular script:

'use strict';
angular.module('myApp')
  .controller('DemoController', function ($scope, $http, DemoService, Tools) {
  var form_submit = function() {$http.post("127.0.0.1:8000/api/forms/create", {name:$scope.applicant, date:$scope.date, address=$scope.address}).success(function(data){ alert(data); })
  .error(function(error){
    alert('something failed');
  })};
  });

Below is the index.html:

    <!DOCTYPE html>
    <head>
    </head>
   <body ng-app="myApp" ng-submit="form_submit()">
    <FORM action="http://127.0.0.1:8000/api/forms/create/" method="post">
   <INPUT type="text" ng-model="applicant" name="name">
    <INPUT type="text" ng-model="date" name="date"> 
    <INPUT type="text" ng-model="address" name="address">
   <INPUT type="submit" value="Send"> 
    </FORM>
    </body>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.min.js"></script>
    <script src="controllers/demo.js"></script>
    </html>

catavaran · Accepted Answer · 2015-02-15 13:48:11Z

1

Try to add / slash at the end of POST url (see the APPEND_SLASH setting for reference):

$http.post("127.0.0.1:8000/api/forms/create/"...

edited Feb 15, 2015 at 13:48

answered Feb 15, 2015 at 13:39

catavaran

45.7k8 gold badges104 silver badges89 bronze badges

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

Comments

Manube · Accepted Answer · 2015-02-15 13:54:15Z

0

Have you tried this:

<FORM ng-submit="form_submit()">

instead of

<body ng-submit="form_submit()">

It should (hopefully) post your $http in the background

answered Feb 15, 2015 at 13:54

Manube

5,2294 gold badges38 silver badges61 bronze badges

2 Comments

Manube Over a year ago

and Srujan Routhu is right: $scope.form_submit= function(){...}

Andy Over a year ago

Thank you. This was the issue that I was having. Appreciate all the help everyone.

srthu · Accepted Answer · 2015-02-15 13:58:06Z

0

your form_submit variable in the controller is not a scope variable.

Instead of using

var form_submit

change it to

$scope.form_submit

I think this will work.

answered Feb 15, 2015 at 13:58

srthu

1973 silver badges14 bronze badges

Collectives™ on Stack Overflow

AngularJS $http.post not getting JSON success response. Instead redirects to URL of the REST endpoint

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related