Naomi Naomi - 4 months ago 11
AngularJS Question

My angular ng-submit doesn't work

I'm only just learning angular and have made a form. The submit doesn't work though. I've followed the instructions from the codeschool course but it still doesn't work. When I press submit it doesn't actually add it and it doesn't clear the form which I want it to and if I haven't missed something out from the instructions it should have everything it needs for it to work but I'm clearly missing something..

HTML



<form name="rateForm" ng-contoller="reviewController as reviewCtrl" ng-submit="reviewCtrl.addRate(rating)">
<blockquote>
<b>Film name: {{reviewCtrl.rate.name}}</b>
<b>Stars: {{reviewCtrl.rate.price}}</b>
</blockquote>
<input type="type" class="film" ng-model="reviewCtrl.rate.name"></input>
<select ng-model="reviewCtrl.rate.price">
<option value="1">1 star</option>
<option value="2">2 star</option>
<option value="3">3 star</option>
<option value="4">4 star</option>
<option value="5">5 star</option>
</select>
<input type="submit" value="Submit"/>
</form >




JS

(function() {
var app = angular.module('ratingStore', []);



app.contoller("reviewController", function(){

this.rate = {};
this.addRate = function(rating){
rating.rate.push(this.rate)
this.rate = {};
};
})



})();

Answer

(i) As 'user286852' mentioned you need to add the ng-submit inside the form otherwise, add a button for the submit function and call it in ng-click event.

(ii)You need to defined the $scope variable for ratings to be stored.

   $scope.rate = {};
   $scope.rating = [];
   $scope.rating.rate = [];
   $scope.addRate = function() {
   $scope.rating.rate.push($scope.rate)
   console.log($scope.rating.rate);
   $scope.rate = {};
  };

Here is the working Rating App

Comments