form validation javascript for specific digit

Question

i want to put another condition where mobile No. should contain 8 digits only starting with 5. (ex:52024050). any help

function formValidation() {
  var mobile = document.forms["form"]["mobile"].value;

  // red expression 
  var checkNumbers = /^[0-9 ]+$/;

  if (mobile == null || mobile == "") {
    error[error.length] = ("Enter your mobile number");
    document.form.mobile.focus();
    $(document.forms["form"]["mobile"]).css("background-color", "blue");;
  } else if (mobile != null || mobile != "") {
    if (!checkNumbers.test(mobile)) {
      error[error.length] = ("Enter Only numeric Characters for mobile phone");
      document.form.mobile.focus();
      $(document.forms["form"]["mobile"]).css("background-color", "blue");
    }

<form name="form" onsubmit="return formValidation()" action="process.html">

  Mobile phone:&nbsp&nbsp&nbsp&nbsp&nbsp
  <input type="text" name="mobile" id="mobile">

  <input id="submit" type="submit" name="submit" id="submit">

Tushar · Accepted Answer · 2015-11-08 11:34:43Z

You can use regex as follow

/^5[0-9]{7}$/

Regex Demo and Explanation

^: Start of line
5: Matches 5 once
[0-9]{7}: Matches any number between 0 and 9 exactly 7 times
$: End of line

I'd suggest to use the regex on element itself in pattern attribute and maxlength.

input:valid {
  color: green;
}
input:invalid, span {
  color: red;
}
span {
  display: none;
}
input:invalid + span {
  display: block;
}

<input type="text" pattern="5[0-9]{7}" maxlength="8" />
<span>Enter Only numeric Characters for mobile phone.</span>

As jQuery is included on page, I'd recommend to use it for DOM manipulation and event handling.

HTML:

<form name="form" action="process.html">
    Mobile phone:&nbsp&nbsp&nbsp&nbsp&nbsp
    <input type="text" name="mobile" id="mobile" pattern="5[0-9]{7}" maxlength="8">

    <input id="submit" type="submit" name="submit" id="submit">
</form>

JavaScript:

var mobilePattern = /^5[0-9]{7}$/;
$('form[name="form"]').on('submit', function(e) {
    var mobile = $('#mobile').val();

    if (!mobilePattern.test(mobile)) {
        $('#mobile').css('background', 'blue').focus();
    }
});

pattern doesn't work properly with Safari and IE prior to 10, I wouldn't encourage using it right now.
@MateoBarahona It should be accompanied by the JS code to check the format. I'm not saying that use pattern only. If that is supported by browser JS will not be called again and again as browser's native validation will work, if not then it'll be simply ignored as custom attribute.
ok, I couldn't see the javascript code when I commented and I was afraid supergirl would think she didn't need JS code.

Mateo Barahona · Accepted Answer · 2015-11-08 11:20:56Z

1

You can try this regex:

var checkMobile = /^5[0-9]{7}$/;

^5 => starts with 5

[0-9]{7}$ => followed and ending by 7 numbers

edited Nov 8, 2015 at 11:20

answered Nov 8, 2015 at 11:10

Mateo Barahona

1,3918 silver badges11 bronze badges

Collectives™ on Stack Overflow

form validation javascript for specific digit

2 Answers 2

3 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Related