Apply bootstrap button textbox and text-area div using angular js code
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Practice1.aspx.cs" Inherits="angularJs1.WebPages.Practice1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Angular Js</title>
<link href="../Content/bootstrap.min.css" rel="stylesheet" />
<script src="../scripts/angular.min.js"></script>
<script src="../scripts/jquery-1.9.1.min.js"></script>
<script src="../scripts/bootstrap.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div ng-app="">
<div class="row">
<div class="col-md-6 col-sm-6 col-lg-6">
<div class="form-group">
<label for="urs">Full Name :</label>
<input type="text" class="form-control" ng-model="Name" />
</div>
<div class="form-group">
<label for="Email">Email Id :</label>
<input type="email" class="form-control" ng-model="Email" />
</div>
<div class="form-group">
<label for="Mobile">Mobile No:</label>
<input type="tel" ng-model="Mobile" class="form-control" />
</div>
<div class="form-group">
<label for="Message">Message :</label>
<textarea id="txtMessage" class="form-control" style="height: 300px;" ng-model="Message"></textarea><br />
</div>
</div>
<div class="col-md-6 col-sm-6 col-lg-6">
<label for="er">Full Name : </label>
<div class="well well-lg well-sm">{{Name}}</div>
<label for="me">Email Id :</label>
<div class="well well-lg well-sm">{{Email}}</div>
<label for="dat">Mobile No : </label>
<div class="well well-lg well-sm" ng-bind="Mobile"></div>
<label for="data">Message :</label>
<div class="well well-lg well-sm" ng-bind="Message"></div>
</div>
</div>
<div style="text-align:center;">
<button type="submit" class="btn btn-primary">Submit</button>
<button type="reset" class="btn btn-primary">Reset</button>
</div>
</div>
</form>
</body>
</html>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Angular Js</title>
<link href="../Content/bootstrap.min.css" rel="stylesheet" />
<script src="../scripts/angular.min.js"></script>
<script src="../scripts/jquery-1.9.1.min.js"></script>
<script src="../scripts/bootstrap.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div ng-app="">
<div class="row">
<div class="col-md-6 col-sm-6 col-lg-6">
<div class="form-group">
<label for="urs">Full Name :</label>
<input type="text" class="form-control" ng-model="Name" />
</div>
<div class="form-group">
<label for="Email">Email Id :</label>
<input type="email" class="form-control" ng-model="Email" />
</div>
<div class="form-group">
<label for="Mobile">Mobile No:</label>
<input type="tel" ng-model="Mobile" class="form-control" />
</div>
<div class="form-group">
<label for="Message">Message :</label>
<textarea id="txtMessage" class="form-control" style="height: 300px;" ng-model="Message"></textarea><br />
</div>
</div>
<div class="col-md-6 col-sm-6 col-lg-6">
<label for="er">Full Name : </label>
<div class="well well-lg well-sm">{{Name}}</div>
<label for="me">Email Id :</label>
<div class="well well-lg well-sm">{{Email}}</div>
<label for="dat">Mobile No : </label>
<div class="well well-lg well-sm" ng-bind="Mobile"></div>
<label for="data">Message :</label>
<div class="well well-lg well-sm" ng-bind="Message"></div>
</div>
</div>
<div style="text-align:center;">
<button type="submit" class="btn btn-primary">Submit</button>
<button type="reset" class="btn btn-primary">Reset</button>
</div>
</div>
</form>
</body>
</html>
Comments
Post a Comment