| <!doctype html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <title>Example - example-example99</title> |
| |
| |
| <script src="../../../angular.min.js"></script> |
| |
| |
| |
| </head> |
| <body ng-app=""> |
| <div ng-controller="Controller"> |
| <form novalidate class="css-form"> |
| Name: |
| <input type="text" ng-model="user.name" required /><br /> |
| E-mail: <input type="email" ng-model="user.email" required /><br /> |
| Gender: <input type="radio" ng-model="user.gender" value="male" />male |
| <input type="radio" ng-model="user.gender" value="female" />female<br /> |
| <button ng-click="reset()">RESET</button> |
| <button ng-click="update(user)">SAVE</button> |
| </form> |
| </div> |
| |
| <style type="text/css"> |
| .css-form input.ng-invalid.ng-dirty { |
| background-color: #FA787E; |
| } |
| |
| .css-form input.ng-valid.ng-dirty { |
| background-color: #78FA89; |
| } |
| </style> |
| |
| <script> |
| function Controller($scope) { |
| $scope.master = {}; |
| |
| $scope.update = function(user) { |
| $scope.master = angular.copy(user); |
| }; |
| |
| $scope.reset = function() { |
| $scope.user = angular.copy($scope.master); |
| }; |
| |
| $scope.reset(); |
| } |
| </script> |
| </body> |
| </html> |
