Routing is not working in an Angular and nodejs application

Question

Basically i am not a JS developer. But for an application i am using angularjs as front end and nodejs as a backend.

In angularjs i have written a form that needs to be filled by a user, once user fills that form he can submit it using submit button. On submit button click event i have written below code.

<div class="submit" align="center">
    <input type = "submit" value="Submit !" ng-click="addResume()">
 </div>

Where addResume() is a function declared inside angular controller as below -

$scope.addResume = function(){
    console.log($scope.resume);
    $http.post("/Resume", $scope.resume);
};

This function will call a function on node js server. That will simply print the request fields and route on the success.html page. Please see below code for this--

 app.post('/Resume',function(req,res, next){
    console.log(req.body);
     // res.render(path.join(__dirname)+'/views/success.html');
    next();
 })

Now the problem i am facing is that i am able to get the data submitted through the angular form but application doesn,t move to the success page i tried both the options res.render and next() but not able to flow to success page.

Please help me out on this issue.

Walfrat · Accepted Answer · 2016-03-10 13:11:25Z

1

Your doing an Ajax request, ajax request doesn't load pages that you're redirecting at.

If you want to move on the next page you have to do it from client-side :

$http.post("/Resume", $scope.resume).then(function(response){
    // success move to next page here
}, function(rejection){
    // handle failure
})

Another way would be to call the submit form function, so your form is submitted natively, however data won't be send as json to the server they'll be send with the classic query string format in the request body.

answered Mar 10, 2016 at 13:11

Walfrat

5,3941 gold badge18 silver badges36 bronze badges

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

4 Comments

rraghuva Over a year ago

Thanks for the response.I tried the this way but still it is not working. I changed the code in controller as below. $scope.addResume = function(){ console.log($scope.resume); app.get('/success',function(req,res,next){ console.log("Inside the success function.") res.render(path.join(__dirname)+'/views/success.html'); }); $http.post("/Resume", $scope.resume).then(function(response){ $http.get("/success"); }) And in nodejs server i have added. }; I can see the console log of console.log($scope.resume); But still page is not moving on.

Walfrat Over a year ago

Nop this is not the way to do this, $http.get is performing an ajax request exactly like your $http.post. use $ location in order to move to the right page. Angularjs is a single page application, you're suppose to only load the index.html and never moved from it. Documentation of $location docs.angularjs.org/#!/api/ng/service/$location

rraghuva Over a year ago

It would be a great help if you can point me to some written example. Thanks in advance.

Walfrat Over a year ago

For a good usable snippet i need some informations : what are you using to organise your navigation ? ngRoute ($routeProvider), ui-router ($stateProvider) ? Or something else ?

Collectives™ on Stack Overflow

Routing is not working in an Angular and nodejs application

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related