Ng-Form-2

 

In this example we have a form with some fields, on the click of the save button the entered data is displayed as saved data. The type of button is submit and ng-submit directive call funtion for the save button.

 
 
 
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> </head> <body ng-app="app"> <div ng-controller="controllerName"> <form ng-submit="save(user)"> First Name:<input type="text" ng-model="user.firstName"> <br /> Last Name:<input type="text" ng-model="user.lastName"><br /> User Name:<input type="text" ng-model="user.userName"><br /> Password:<input type="password" ng-model="user.password"><br /> Gender: <input type="radio" ng-model="user.gender" value="male" />male <input type="radio" ng-model="user.gender" value="female" />female<br /> <button type="submit">save</button> </form> <pre>Form:{{user | json}}</pre> <pre>Saved Data:{{saveDate | json}}</pre> </div> <script> var app = angular.module("app", []); app.controller('controllerName', ['$scope', function ($scope) { $scope.saveDate = {}; $scope.save = function (user) { $scope.saveDate = angular.copy(user); } }]); </script> </body> </html>
Output