In this artical , I will show you how to add comma seperated phonenumber in Textbox and check validation on PhoneNumber.
First create MVC project & add view for controller,
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
<div class="row" style="margin-top:5em">
<div class="col-md-2">
<label>Enter Phone No.</label>
</div>
<div class="col-md-8">
<input type="text" id="phonenumber" class="form-control" style="width: 40em;" onkeypress="return /^[0-9,+]*$/.test(event.key)" />
<span id="errornumber" style="color:red"></span>
</div>
</div>
<br />
<br />
<div class="row">
<div class="col-md-2"></div>
<div class="col-md-4">
<button id="check">Check</button>
</div>
</div>
</body>
</html>
Here, onkeypress event allow to add only number & (+ or ,) special character in Textbox.
now we add click event of button and check each textbox value which have multiple phonenumbers.
$('#check').on('click', function () {
debugger
var num = $('#phonenumber').val();
if (num != null && num != '') {
var numbers = num.split(',');
var phonenumber;
var Newarray = [];
var WArray = [];
var status = 0;
for (var i = 0; i < numbers.length; i++) {
if (numbers[i] != undefined || numbers[i] != null && numbers[i] != '') {
numbers[i] = numbers[i].replace(/-/g, "");
if (/^(\+91[\-\s]?)?[0]?(91)?[6-9]{1}[0-9]{9}$/.test(numbers[i])) {
if (numbers[i].substr(0, 3) == '+91') {
numbers[i] = numbers[i].replace('+91', '');
}
phonenumber=formatPhoneNumber(numbers[i]);
Newarray.push(phonenumber);
}
else {
WArray.push(numbers[i]);
status = 1;
}
}
}
if (status == 1 && Newarray.length == 0) {
$("#errornumber").html("Please Enter Valid PhoneNumber");
}
else {
$("#errornumber").html('');
}
$('#phonenumber').val(Newarray.join(','));
}
});
function formatPhoneNumber(value) {
var formattedPhoneNumber = String(value);
if (value != undefined || value != null && value != '') {
value = value.replace(/-/i, '');
if (value.length == 10) {
formattedPhoneNumber = value.substring(0, 3) + '-' + value.substring(3, 6) + '-' + value.substring(6, 10);
}
}
return formattedPhoneNumber;
}
This is regex for indian local mobile number validation.
Here regular expression for phonenumber is /^(\+91[\-\s]?)?[0]?(91)?[6-9]{1}[0-9]{9}$/ , where
^ #Match the beginning of the string
(\+91[\-\s]?)?[0]?(91)? #Allow +91 to optional
[6-9]{1} #Match first digit to (6,7,8,9)
[0-9]{9} #Match last 9 digits to(0-9) numbers
$ #Match the end of the stringOutput:
