Sending form with optional parameters POST-method + angularJS

Question

I'm trying to make a form that sends an url of the type /:id/:option where I know the id before entering the form but the option-attribute is the one that the user selects from the radio-buttons. After submitting the form I should move to the page /:id/:option. I'm also using angulasJS with my application.

So how can I send the url with the POST-method?

html

<form method="POST">
    <div class="voteOptions" ng-repeat="item in id.data.options">
      <label class="radioButtons">{{item.title}} votes:{{item.votes}}
        <input type="radio" name="option" value={{item.option}}>
        <span class="radioSelector"></span>
      </label>
    </div>
    <input type="submit" id="voteSubmit" value="Vote!">
  </form>

.post-call

app.post('/:id/:option', (req, res) => {
  var poll = polls[req.params.id-1];
  poll.options[req.params.option-1].votes++;
  res.json(poll);
});

There's the post-call. I don't have anything (for this part of the code) in the controller yet. — BlackOwl
– BlackOwl, Commented Feb 28, 2018 at 7:25
I agree It's post-call but where you have mention URL in form. — Rahul Sharma
– Rahul Sharma, Commented Feb 28, 2018 at 7:26

Rahul Sharma · Accepted Answer · 2018-02-28 07:41:42Z

Create Controller and make Http call from there.

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">

<form method="POST" ng-submit="submit()">
    <div class="voteOptions" ng-repeat="item in options">
      <label class="radioButtons">{{item.title}} votes:{{item.votes}}
        <input type="radio" name="option" value={{item.option}} ng-model="option.val">
        <span class="radioSelector"></span>
      </label>
    </div>
    <input type="submit" id="voteSubmit" value="Vote!">
  </form>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope,$http) {
    var id = 12345;
	$scope.option = {val:0};
	$scope.options= [{
    	title : 'option-1',
        votes : 5,
        option : 1
    },{
    	title : 'option-2',
        votes : 5,
        option : 2
    }];
    
    $scope.submit = function(){
    	console.log('Url', `<domain>/${id}/${$scope.option.val}`);
        // Generate url and call http post
         // $http.post(url, body, config)
        //  .success(function (data, status, headers, config) {
        //  })
        //     .error(function (data, status, header, config) {
        //     });
    }
});
</script>

</body>
</html>

Collectives™ on Stack Overflow

Sending form with optional parameters POST-method + angularJS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related