<html ng-app="voterApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
</head>
<body ng-controller="VoterController">
<h1>Voter Details</h1>
<form name="voterForm" novalidate>
<label for="name">Name:</label>
<input type="text" id="name" name="name" ng-model="voter.name" ng-change="convertToUpperCase()" required>
<label for="age">Age:</label>
<input type="number" id="age" name="age" ng-model="voter.age" required ng-min="18">
<label for="nationality">Nationality:</label>
<input type="text" id="nationality" name="nationality" ng-model="voter.nationality" required ng-pattern="/^Indian$/i">
<div ng-show="voterForm.nationality.$error.pattern">Nationality should be 'Indian'.</div>
<button type="submit" ng-disabled="voterForm.$invalid">Submit</button>
</form>
<script>
var app = angular.module('voterApp', []);
app.controller('VoterController', function ($scope) {
$scope.voter = {};
$scope.convertToUpperCase = function () {
$scope.voter.name = $scope.voter.name.toUpperCase();
};
});
</script>
</body>
</html>
No comments:
Post a Comment