Hi,
I have 2 textboxes named as 1)Phone no and 2)Email
Coming to my requirement Phone 1 is required
and also i am going to use reg exp to both Phone no
and email
Ex:At Phone no textbox i need to enter regexp(only phone number)
ex:24344444448
n the same way at email also i am going to use reg ex (only email format)
Ex:mahesh@gmail.com
I have shared you code
could you please check it and help me
@{
Layout = null;
}
<html ng-app="myApp">
<head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.0/css/bootstrap.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.8/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.8/angular.min.js"></script>
<script>
var app = angular.module("myApp", []);
app.controller("myCntrl", ['$scope', '$http', function ($scope, $http) {
$scope.AddUpdateEmployee = function (isValid) {
if (isValid) {
$scope.mahesh = false;
alert("Form is valid");
$scope.userForm.$setPristine();
}
else {
$scope.mahesh = true;
// Show error Message if Form not valid.
if ($scope.userForm.$error.required != undefined) {
for (var i = 0; i < $scope.userForm.$error.required.length; i++) {
$scope.userForm.$error.required[i].$pristine = false;
}
}
}
}
}]);
</script>
</head>
<body ng-controller="myCntrl">
<div class="container">
<div>
<div id="wrapper" class="clearfix">
<form name="userForm" novalidate>
<div class="form-horizontal">
<div class="row">
<div class="col-md-4" ng-class="{ 'has-error' : userForm.STI_Phone.$invalid && !userForm.STI_Phone.$pristine }">
<label for="STI_Phone">
Phone No
</label>
<input type="text" ng-model="STI_Phone" name="STI_Phone" class="form-control" required />
<p style="color: red" ng-show="userForm.STI_Phone.$error.required && !userForm.STI_Phone.$pristine"
class="help-block">
Phone No is required.
</p>
</div>
<div class="col-md-4">
<label for="STI_Email">
Email
</label>
<input type="text" ng-model="STI_Email" name="STI_Email" class="form-control"/>
</div>
</div>
<div class="form-group" style="width: 120%; text-align: center; padding: 10px;">
<div class="col-md-offset-2 col-md-5">
<p>
<button class="btn btn-success btn-sm" ng-model="IsVisible" ng-click="AddUpdateEmployee(userForm.$valid)">
Submitt
</button>
</p>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</body>
</html>