<html>
Output:
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<style>
table{
border:1px solid black;
height:400px;
width:550px;
padding-top:20px;
padding-bottom:20px;
padding-left:20px;
background-color:#ff5050;
}
</style>
</head>
<body>
<center>
<h1>Student Detail</h1></br>
<div ng-app="myapp"
ng-controller="myctrl">
<table>
<tr>
<td>Enter Name</td>
<td><input type="text"
ng-model="name"></td>
</tr>
<tr>
<td>Enter Email</td>
<td><input type="email"
ng-model="email"></td>
</tr>
<tr>
<td>Enter contact number</td>
<td><input type="number"
ng-model="phone"></td>
</tr>
<tr>
<td>Enter Address</td>
<td><textarea
ng-model="address"></textarea></td>
</tr>
<tr>
<td>Enter Gender</td>
<td><input type="radio"
ng-model="r1" value="Male">Male
<input type="radio"
ng-model="r1" value="Female">Female
</td>
</tr>
<tr>
<td>Enter Hobbies</td>
<td>
<input type="checkbox"
ng-model="ch1" value="dancing">Dancing
<input
type="checkbox" ng-model="ch2"
value="Shopping">Shopping
<input type="checkbox"
ng-model="ch3" value="traveling">Traveling
</td>
</tr>
<tr>
<td>Enter Qualification</td>
<td><select ng-model="quali">
<option
value="MCA">MCA</option>
<option
value="MBA">MBA</option>
<option
value="Mcom">Mcom</option>
</select></td>
</tr>
</table>
<p
ng-bind="name"></p></br>
<p
ng-bind="email"></p></br>
<p
ng-bind="phone"></p></br>
<p
ng-bind="address"></p></br>
<p
ng-bind="r1"></p></br>
<p ng-show="ch1">dancing</p>
<p ng-show="ch2">shopping</p>
<p ng-show="ch3">traveling</p>
<p ng-bind="quali"></p>
</div>
</form>
</center>
<script>
var demo=angular.module('myapp',[]);
demo.controller('myctrl',function($scope)
{
$scope.name="Yogita";
$scope.email="yogita@gmail.com";
$scope.phone=7216534390;
$scope.address="pune";
$scope.r1="female";
$scope.ch2="shopping";
$scope.quali="MCA";
});
</script>
</body>
</html>
Output:
Hey Suryosnata,
ReplyDeleteVery good. keep it up!
Regards,
Jack
Thank u for your compliments.Keep Learning and more to update.
DeleteReally Good blog post.provided a helpful information.I hope that you will post more updates like this AngularJS4 Online Training Hyderbad
ReplyDeletePython is an open-source, high level, interpreted programming language which offers great opportunities for object-oriented programming. Choosing a python training program from Red Prism Group, which is best training institute for python in noida.
ReplyDelete