Ng-Submit-3

 

Ng-Submit-3

 
 
 
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Welcome to LearnKode - A code learning platform</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <style> .error { color: maroon; } </style> </head> <body ng-app="app"> <div ng-controller="ExampleController"> <div class="container"> <h3>Registration form.</h3> <form name="frmRegister" ng-submit="register();" novalidate> <div> First Name: <input name="first_name" class="form-control" type="text" ng-model="firstName" required /> <span class="error" ng-show="frmRegister.first_name.$dirty && frmRegister.first_name.$error.required">First Name is required</span> </div> <div> Last Name: <input name="last_name" class="form-control" type="text" ng-model="lastName" required /> <span class="error" ng-show="frmRegister.last_name.$dirty && frmRegister.last_name.$error.required">Last Name is required</span> </div> <div> Email: <input name="email" class="form-control" type="email" ng-model="email" required /> <span class="error" ng-show="frmRegister.email.$dirty && frmRegister.email.$error.required">Email is required.</span> <span class="error" ng-show="frmRegister.email.$dirty && frmRegister.email.$error.email">Invalid Email address.</span> </div><br /> <input type="submit" value="Save" class="btn btn-default" ng-disabled="frmRegister.$invalid" /> <span ng-show="registered"><br />YOU ARE SUCCESSFULLY REGISTERED.</span> </form> </div> </div> <script> var app = angular.module("app", []); app.controller('ExampleController', ['$scope', function ($scope) { $scope.register = function () { $scope.registered = true; } }]); </script> </body> </html>
Output