Allow only 10 numbers in textbox using Jquery

Allow only 10 numbers in textbox using Jquery

In this post we will give you information about Allow only 10 numbers in textbox using Jquery. Hear we will give you detail about Allow only 10 numbers in textbox using JqueryAnd how to use it also give you demo for it if it is necessary.

In this example, i will show you 10 digit mobile number validation in jquery using regular expression. we just allow only 10 digit number validation in jquery. user can only enter 10 numbers in textbox using jquery for phone number or mobile validation. it means jquery allow only 10 digits.

Whenever you are working with mobile number and phone number at that time you most of need to restrict user to enter only numbers in textbox using jquery. we can do it that thing multiple way. i will give you simple two example of how to restrict user to type 10 digit numbers in input element.

One it using pattern attribute in html and another is maxlength and jquery keypress event. So you can just see both example. You can see also preview bellow. You can use anyone as you want.

So let’s see both example, that will help you to set validation for mobile number:

Example 1:

<!DOCTYPE html>

<html>

<head>

<title>Allow only 10 numbers in textbox using Jquery - ItSolutionStuff.com</title>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

</head>

<body>

<form>

<h1>Allow only 10 numbers in textbox using Jquery - ItSolutionStuff.com</h1>

<input type="text" name="phone" placeholder="Phone..." pattern="[1-9]{1}[0-9]{9}">

<button type="submit">Submit</button>

</form>

</body>

</html>

Example 2:

<!DOCTYPE html>

<html>

<head>

<title>Allow only 10 numbers in textbox using Jquery - ItSolutionStuff.com</title>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

</head>

<body>

<form>

<h1>Allow only 10 numbers in textbox using Jquery - ItSolutionStuff.com</h1>

<input type="text" name="phone" placeholder="Phone..." maxlength="10" >

<button type="submit">Submit</button>

</form>

</body>

<script type="text/javascript">

$('.phone').keypress(function(e) {

var arr = [];

var kk = e.which;

for (i = 48; i < 58; i++)

arr.push(i);

if (!(arr.indexOf(kk)>=0))

e.preventDefault();

});

</script>

</html>

You can see preview:

I hope it can help you…

Hope this code and post will helped you for implement Allow only 10 numbers in textbox using Jquery. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs

For More Info See :: laravel And github

Leave a Comment

Your email address will not be published. Required fields are marked *

33  +    =  41

We accept paid advance and paid guest Posting on our Site : Contact US