AngularJS Tutorial - ng-submit

ng-submit binds an expression to an onsubmit event.

This directive prevents the default action, but only if the form does not contain an action attribute.

Example

The following code shows how to ng-submit.


<!doctype html>
<!--<!--from  ww  w .j a v a 2s.  com-->
Created using JS Bin
http://jsbin.com

Copyright (c) 2014 by auser (http://jsbin.com/ONIcAC/1/edit)

Released under the MIT license: http://jsbin.mit-license.org
-->
<html ng-app="myApp">
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>
</head>
<body>
  
<form ng-submit="submit()" ng-controller="FormController">
  Enter text and hit enter:
  <input type="text" ng-model="person.name" name="person.name" />
  <input type="submit" name="person.name" value="Submit" />
  <ul ng-repeat="(index, object) in people">
    <li>{{ object.name }}</li>
  </ul>
</form>
  
<script id="jsbin-javascript">
angular.module('myApp', [])
.controller('FormController', function($scope) {

  $scope.person = {
    name: null
  };

  $scope.people = [];

  $scope.submit = function() {
    if ($scope.person.name) {
      $scope.people.push({name: $scope.person.name});
      $scope.person.name = '';
    }
  };
});
</script>
</body>
</html>

The code above is rendered as follows: