<html>
<head><script
src=" angular.min.js"></script></head>
<body
ng-app="mainApp" ng-controller="voterController">
<div>
<form
name="voterform" novalidate="true">
<table
border="1">
<tr>
<td>Enter
the Name of voter</td>
<td><input
type="text" name="name1" ng-model="name1"
ng-pattern="/^[A-Z]*$/" ng- required="true"></td>
<td><span
style="color:red" ng-show="voterform.name1.$dirty &&
voterform.name1.$invalid"></span>
<span
ng-show="voterform.name1.$error.required">Voter Name is
required.</span>
<span
ng-show="voterform.name1.$error.pattern">only Uppercase characters
are allowed.</span>
</td>
</tr>
<tr>
<td>Enter
the voters age </td>
<td><input
type="number" name="age" ng-model="age"
ng-pattern="/^(?:1[8-9]|[2-5][0-9]|100)$/"
ng-required="true"></td>
<span
ng-show="voterform.age.$error.required">voter age is
required</span>
<span
ng-show=" voterform.age.$error.pattern"> Voter age should be more
than 18</span>
</td>
</tr>
<td>Enter
the Nationality</td>
<td><input
type="text" name="nat" ng-model="nat"
ng-required="true"> </td>
<td>
<span ng-show="voterform.nat.$error.required">Nationality is
required</span>
<span
ng-show="voterform.pincode.$error.pattern">Nationality should be
Indian</span>
</td>
</tr>
<td>
<input type="button" value="Voter Info"
ng-click="isShow('show')"></td>
</tr>
</table>
</form>
</div>
<br><br>
voter
Information<br><br>
<table
border="1">
<thead>
<td>name</td>
<td>Age</td>
<td>Nationality</td>
</thead>
<tr>
<td>{{name1}}</td>
<td>{{age}}</td>
<td>{{nat}}</td>
</tr>
</table>
</div>
<script>
var
mainApp = angular.module("mainApp", []);
mainApp.controller('voterController',
function ($scope) {
$scope.showval
= false;
$scope.isShow
= function (param) {
$scope.showval
= true;
}
</script>
</body>
</center>
</html>