How to validate Email,password,Mobile Number in Angular

Email and Mobile Number

<script src="https://code.angularjs.org/1.2.1/angular.min.js">script>
<div class="container" ng-app="myApp">
<div class="col-md-5">
<div class="form-area" ng-controller="formCtrl">
<form role="form" name="inquiryForm" novalidate>
<br style="clear:both">
<h3 style="margin-bottom: 25px; text-align: center;">Contact Formh3>
<div class="form-group">
<input name="email" ng-model="email" id="eml" type="text" ng-pattern="eml_add" ng-required="true" autocomplete="off" placeholder="Email" class="form-control" >
<span class="red-text" ng-if="inquiryForm.email.$error.required && inquiryForm.email.$dirty">Email is a required fieldspan>
<span class="red-text" ng-show="inquiryForm.email.$error.pattern">Invalid Emailspan>
div>
<div class="form-group">
<input name="contact" ng-model="contact" id="c_num" type="text" ng-required="true" ng-pattern="ph_numbr" autocomplete="off" placeholder="Contact Number" class="form-control">
<span class="red-text" ng-if="inquiryForm.contact.$error.required && inquiryForm.contact.$dirty">Contact number is a required fieldspan>
<span class="red-text" ng-show="inquiryForm.contact.$error.pattern">Please enter a 10 digit numberspan>
div>
<button type="button" id="submit" name="submit" class="btn btn-primary pull-right" ng-disabled="inquiryForm.$invalid">Submit Formbutton>
form>
div>
div>
div>

.red-text{
color:red;
}

var app = angular.module("myApp", []);
app.controller("formCtrl", ['$scope', function($scope) {
$scope.ph_numbr = /^\+?\d{10}$/;
$scope.eml_add = /^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/;
}]);

2 Replies

Know the answer? Post it — somebody with the same question will find it here.

Rajanikant Hawaldar7y ago
Accepted answer
Hi Chittarankan,

Go through below links which contains validations which you want and let me know issue are fixed or not

https://stackoverflow.com/questions/41385842/angularjs-email-or-phone-number-validation

https://codepen.io/DynamicSingh/pen/GpPybJ

https://stackoverflow.com/questions/51605737/confirm-password-validation-in-angular-6

Thanks
+1
Rajanikant Hawaldar7y ago
Email and Mobile Number
<script src="https://code.angularjs.org/1.2.1/angular.min.js">script>
<div class="container" ng-app="myApp">
<div class="col-md-5">
    <div class="form-area" ng-controller="formCtrl">
        <form role="form" name="inquiryForm" novalidate>
        <br style="clear:both">
                    <h3 style="margin-bottom: 25px; text-align: center;">Contact Formh3>

                    <div class="form-group">
                        <input name="email" ng-model="email" id="eml" type="text" ng-pattern="eml_add" ng-required="true" autocomplete="off" placeholder="Email" class="form-control" >

            <span class="red-text" ng-if="inquiryForm.email.$error.required && inquiryForm.email.$dirty">Email is a required fieldspan>

            <span class="red-text" ng-show="inquiryForm.email.$error.pattern">Invalid Emailspan>
                    div>
                    <div class="form-group">
                        <input name="contact" ng-model="contact" id="c_num" type="text" ng-required="true" ng-pattern="ph_numbr" autocomplete="off" placeholder="Contact Number" class="form-control">

            <span class="red-text" ng-if="inquiryForm.contact.$error.required && inquiryForm.contact.$dirty">Contact number is a required fieldspan>
            <span class="red-text" ng-show="inquiryForm.contact.$error.pattern">Please enter a 10 digit numberspan>

                    div>


        <button type="button" id="submit" name="submit" class="btn btn-primary pull-right" ng-disabled="inquiryForm.$invalid">Submit Formbutton>
        form>
    div>
div>
div>
.red-text{
  color:red;
}
var app = angular.module("myApp", []);
app.controller("formCtrl", ['$scope', function($scope) {
        $scope.ph_numbr = /^\+?\d{10}$/;
        $scope.eml_add = /^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/;
}]);
+1