Ng-Blur-8

 

Ng-Blur-8

 
 
 
<!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> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> </head> <body ng-app="app"> <div class="container"> <div ng-controller="LearnIt"> <h3>Ng-Blur</h3> <h3>Enter your Name here</h3> <input class="form-control" ng-model="name" type="text" ng-blur="checkName(name)" /> <h3>Enter your Age here(Age should be 18 to 60 years.)</h3> <input class="form-control" ng-model="age" type="text" ng-blur="checkAge(age)" /> <label ng-show="!msg && age">Your age is not valid.</label> <label ng-show="msg && age">Your age is valid.</label> </div> <script> var app = angular.module("app", []); app.controller('LearnIt', ['$scope', '$timeout', function ($scope, $timeout) { $scope.checkName = function (name) { if (name == undefined | name == "" || typeof name == "undefined") { alert("Please enter your Name."); }; }; $scope.checkAge = function (age) { var ageInNumber = parseInt(age); if (ageInNumber > 18 && ageInNumber < 60) $scope.msg = true; else $scope.msg = false; }; }]); </script> </div> </body> </html>
Output