<html>
<head>
<title>Doctor Information</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.0/angular.min.js"></script>
</head>
<body ng-app="mainApp" ng-controller="docctrl">
<h2>Doctor Information Details Form</h2>
<div>
<table border="1">
<tr>
<td>Enter the Doctor Number</td>
<td><input type="number" name="docno" ng-model="docno"></td>
</tr>
<tr>
<td>Enter the Doctor Name </td>
<td>
<input type="text" name="docname" ng-model="docname">
</td>
</tr>
<tr>
<td>Enter the Doctor Address </td>
<td><input type="text" name="docaddress" ng-model="docaddress"> </td>
</tr>
<tr>
<td>Enter Phone Number</td>
<td> <input type="number" name="phone" ng-model="phone"></td>
</tr>
<tr>
<td>Enter the Doctor Specialization</td>
<td> <input type="text" name="docspl" ng-model="docspl"></td>
</tr>
<tr>
<td> <input type="button" value="Doctor Details" ng-click="isShow('show')">
</td>
</tr>
</table>
</div>
<div ng-show="showval">
<br><br>
Doctor Details<br><br>
<table border="1">
<thead>
<td>Doctor No</td>
<td>Doctor Name</td>
<td>Doctor Address</td>
<td>Doctor Phone</td>
<td>Doctor Specialization</td>
</thead>
<tr>
<td>{{docname}}</td>
<td>{{docname}}</td>
<td>{{docaddress}}</td>
<td>{{phone}}</td>
<td>{{docspl}}</td>
</tr>
</table>
</div>
<script>
var mainApp = angular.module("mainApp", []);
mainApp.controller('docctrl', function ($scope) {
$scope.showval = false;
$scope.isShow = function (param) {
if (param == "show") {
$scope.showval = true;
}
}
});
</script>
</body>
</html>
0 Comments