JavaScript: Mobile number validation with numbers and max length

Question

I'm trying to have a JS which has the requirement as below

I have a textbox of type number and whenever i typed inside that textbox should ONLY ALLOW numbers [0-9] and it should NOT ALLOW the length of the numbers entered to be more than 8 digits.

Eg:

12345678 - Allow
1234    - Dont Allow
1234%^  - Dont Allow

My Html:

<input type="number" id="txt_number" maxlength="8" onkeypress="return isNumber(event)">

My JS

 function isNumber(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57 ||charCode>=190)) {
    return false;
}
return true;
}

Please help me.

Appreciate. Thanks

You have input type number so you don't need the function check like you are doing. — Jai, Jul 26 '16 at 11:45
personnally, I use this solution in my code: http://stackoverflow.com/a/29902316/4949388 — Jonathan Parent Lévesque, Jul 26 '16 at 11:55
You said the number cannot be more than 8 digits, but a number with 4 digits is not allowed either? Maybe you mean the number can only have 8 digits. Please make the requirements more clear in your question. — kamoroso94, Jul 27 '16 at 03:01

kollein · Answer 1 · 2016-07-27T08:06:30.957

0

Use RegEx match:

function checkMonum(){
var input=document.getElementById('txt_number').value;
    var state=false;
    var re=/^[\d\.]{8}$/;
var output = re.test(input);
if(output==true){
   state=true;
}
return state;
}

i change method match with test, you can check in FF. i am on mobile in chrome. Exactly with 8 digits or has period

edited Jul 27 '16 at 08:06

answered Jul 27 '16 at 03:03

kollein

328
3
10

how to call this function? – Senthil RS Jul 27 '16 at 03:27
Hi Kollein, i see it is allowing only numbers. But it allows . (dot decimal) as well.But i dont want the user to type any numbers above 8 digits length. I want to just allow only to have 8 digits. Any input above 8 digits length can be truncated – Senthil RS Jul 27 '16 at 03:39
change to be: var re=/^(\d|\.?){8}$/; – kollein Jul 27 '16 at 03:49
Hi Kollein, i tried the below function but it is not allowing any thing to type including numbers function checkMonum(){ var input=document.getElementById('txt_number').value; var state=false; var re=/^(\d|\.?){8}$/; var output = input.match(re); if(output.length==8){ state=true; } – Senthil RS Jul 27 '16 at 03:58
because you set IF condition in wrong, must be: output.lenth>0 – kollein Jul 27 '16 at 04:05
or set :if( output != null) , meaning input has matche with statement be enough 8 digits or has one char " dot decimal " – kollein Jul 27 '16 at 04:06
Hi Kollein, the updated code of the JS is not allowing anything to type. Includes alphanumeric and special characters.. Can you please help. Thanks – Senthil RS Jul 27 '16 at 06:22
answer above accepts: 8 digits or has a dot. You can check input='12345678' or input='1234.5678' – kollein Jul 27 '16 at 06:47
Hi Kollein, i see your code allows (.) dot https://jsfiddle.net/SenthilRS/6gmc1ojq/4/ . i also see the JS not working in mozilla fire fox browser – Senthil RS Jul 27 '16 at 07:31
work fine in Chrome, you should update the code above for checking again – kollein Jul 27 '16 at 07:46
https://jsfiddle.net/SenthilRS/6gmc1ojq/6/ allows more than 8 digits length and also allows (.) dot. I used the above code you updated – Senthil RS Jul 27 '16 at 07:52
if you want exactly 8 digits ? – kollein Jul 27 '16 at 07:57

score 0 · Answer 2 · answered Jul 27 '16 at 05:20

0

please try this

 function isNumber(evt) {
 evt = (evt) ? evt : window.event;
 var charCode = (evt.which) ? evt.which : evt.keyCode;
 if (charCode > 31 && (charCode < 48 || charCode > 57)) {
     return false;
 }

 return true;

}

answered Jul 27 '16 at 05:20

Subash

232
1
3
12

score 0 · Answer 3 · answered Jul 27 '16 at 05:26

 $(function () {
    $(".numericOnly").bind('keypress', function (e) {
        if (e.keyCode == '9' || e.keyCode == '16') {
            return;
        }
        var code;
        if (e.keyCode) code = e.keyCode;
        else if (e.which) code = e.which;
        if (e.which == 46)
            return false;
        if (code == 8 || code == 46)
            return true;
        if (code < 48 || code > 57)
            return false;
    }
    );
    $(".numericOnly").bind("paste", function (e) {
        $("#lblSearchError").text("Phone no must be numeric digit only !!!");
        $('#lblSearchError').show('slow').delay(3000).queue(function (n) {
            $(this).hide('slow'); n();
        });
        e.preventDefault();
    });
    $(".numericOnly").bind('mouseenter', function (e) {
        var val = $(this).val();
        if (val != '0') {
            val = val.replace(/[^0-9]+/g, "")
            $(this).val(val);
        }
    });
});

with this function you can restrict user to enter other than numeric values and user won't be able to past any non-numeric data. this works for me You can use it by class name or by ID

Hi Naveen, Can you please tell me how to call this js and what are the html changes required. i call my exisiting js as — Senthil RS, Jul 27 '16 at 06:23
add 'numericOnly' class to your input type control it will work this only you have to do — Naveen Ganeshe, Jul 27 '16 at 07:45

JavaScript: Mobile number validation with numbers and max length

3 Answers3