Disable number input in a text input with js

Question

What I have to do is not permit to introduce number characters in a text input in a form, but I've to do it with javascript. Here's my HTML code:

<form id="formu">
<input type="text" id="num" />
</form>

And here's my JS code:

function numero(theEvent){

    var evento=theEvent||window.event;

        switch(evento.type){
            case 'keypress':
                if(document.getElementById("num").evento.keyCode>=48&&document.getElementById("num").evento.keyCode<=57){
                    return false;
                }
        }
    }

where did u call numero(theEvent) ?

Vicky Gonsalves
– Vicky Gonsalves

2013-11-15 09:14:51 +00:00
Commented Nov 15, 2013 at 9:14 — Vicky Gonsalves
– Vicky Gonsalves, Commented Nov 15, 2013 at 9:14

Jayanth Ramachandran · Accepted Answer · 2013-11-15 09:15:02Z

9

You can use the new pattern attrib HTML ,

<input type="text" id="num" pattern="[A-Za-z]" title="Only Alphabets">

answered Nov 15, 2013 at 9:15

Jayanth Ramachandran

9,3362 gold badges16 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Vicky Gonsalves · Accepted Answer · 2013-11-15 09:18:20Z

3

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


<form id="formu">
<input type="text" id="num"  onkeypress="return validateKeyStrokes(event)" />
</form>

Try this

answered Nov 15, 2013 at 9:18

Vicky Gonsalves

11.8k3 gold badges39 silver badges58 bronze badges

Comments

fan711 · Accepted Answer · 2013-11-15 09:20:28Z

0

Try using jQuery and a plugin for input text field filtering

See here

answered Nov 15, 2013 at 9:20

fan711

7263 silver badges14 bronze badges

2 Comments

Vicky Gonsalves Over a year ago

Why to use such a big library just to validate keystrokes?

fan711 Over a year ago

It might be overkill indeed in some cases. On the other hand jQuery makes life easier with many common tasks which may justify using it. I've also thought about keypress event but it would not handle paste.

0x1gene · Accepted Answer · 2013-11-15 09:20:46Z

0

You can also use the HTML5 new input type number :

<input type="number" name="num" id="num">

But use with care if you want to provide old browsers support ...

answered Nov 15, 2013 at 9:20

0x1gene

3,4675 gold badges32 silver badges49 bronze badges

Collectives™ on Stack Overflow

Disable number input in a text input with js

4 Answers 4

Comments

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related