I'm trying to make sure the input in a particular field is just an 11 digit number, however my if condition does not seem to be working:
Javascript:
<script>
function check() {
var x = document.forms["myform"]["mobile"].value;
if (!/^\d{11}$/.test(x)) {
myform.action="gender.html";
else {
myform.action="mobilerror.html"
}
}
</script>
And the HTML is:
<form id="myform" onsubmit="check();" >
<input class="input" type="text" name="mobile" required="required"
oninvalid="this.setCustomValidity('Number is empty')" oninput="setCustomValidity('')" />
</form>
Please help!
4 Answers 4
You can try maxlength and type attribute of input field:
<input class="input" type="text" name="mobile" maxlength="11" type="number" required="required"/>
If it satisfy your case then you don't need to call javascript function.
1 Comment
type="number".Your regular expression is working just fine. I think the error lies in the "if" condition. Try changing
if (!/^\d{11}$/.test(x)) {
myform.action="gender.html";
else {
myform.action="mobilerror.html"
}
to this
if (/^\d{11}$/.test(x)) {
myform.action="gender.html";
else {
myform.action="mobilerror.html"
}
As you can see I just took off the negation in the expression.
Note: Assuming that the "mobilerror.html" is shown when the user didn't type the 11 digit as expected.
1 Comment
Try this
function check() {
var x = document.forms["myform"]["mobile"].value;
var pattern = new RegExp("^1?([1-9])(\\d{10})");
if (pattern.test(x)) {
myform.action="gender.html";
} else {
myform.action="mobilerror.html"
}
}
^1?([1-9]) checks if the first number is not zero, so that the input value is numerically a 11-digit number. If you don't want it you can remove it.
Comments
This help you :
use type 'number':
<input type="number" id="number" class="input">
and test number digits is 11 or not with :
var patt = /.{11}/;
Example :
<html>
<head>
<style>
</style>
</head>
<body>
<form id="myform" onsubmit="check()" >
<input id="number" class="input" type="number">
<button type="submit">Submit</button>
</form>
<script>
var patt = /.{11}/;
function check(){
var num = document.getElementById("number").value;
var frm = document.getElementById("myform");
if(patt.test(num))
frm.action ="mobilerror.html"
else
frm.action = "gender.html";
}
</script>
</body>
</html>
mobilerror.htmlis called when the 'mobile' field does content a 11-digit number. Is that the expected behavior?