10 Digit Mobile Number Validation in Jquery

by

To validate a 10 digit mobile number in jQuery, you can use regular expressions. Here’s an example code snippet to achieve this.

HTML Form

<form action="" id="form-id">
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname" value="John"><br>
  <label for="lname">Mobile number:</label><br>
  <input type="text" id="lname" name="mobile" id="mobile-number-field" value="Doe"><br><br>
  <input type="submit" value="Submit">
</form>

Jquery Code

$(document).ready(function() {
  $("#form-id").submit(function() {
    var mobileNumber = $("#mobile-number-field").val();
    var mobileNumberPattern = /^[0-9]{10}$/;
    
    if (!mobileNumberPattern.test(mobileNumber)) {
      alert("Please enter a 10 digit mobile number.");
      return false;
    }
  });
});

In the above code, replace “form-id” with the ID of your form, and “mobile-number-field” with the ID of the mobile number input field in your form.

The regular expression /^[0-9]{10}$/ matches any string that consists of exactly 10 digits (0-9). If the input value does not match this pattern, an alert message is displayed and the form submission is prevented.

Note that this code snippet only provides basic validation and does not guarantee that the input is a valid phone number. Depending on your use case, you may need to perform more advanced validation or use a third-party library to validate phone numbers.