How can I set a textbox to only accept Letters in JavaScript?

2nd Mar 2018, 4:22 PM

Dondon Bragais

17 Réponses

+ 3

you can do this with JQuery like that : $(document).ready(function(){ $("#YOURTEXTBOXID").keypress(function(event){ var inputValue = event.which; if(!(inputValue >= 65 && inputValue <= 120) && (inputValue != 32 && inputValue != 0)) { event.preventDefault(); } }); }); in this way you use the ascii codes to work only with letters and white spaces

2nd Mar 2018, 4:43 PM

Michael Ehab Mikhail

+ 3

I recommend placing JavaScript at the end of <body> like this: <html> <head> </head> <body>  <script> //JavaScript here </script> </body> </html> It will work wherever you put it, though. Also, Sololearn has its own JS section, I recommend you use that

2nd Mar 2018, 4:50 PM

ReimarPB

+ 2

var x = prompt("What is your name?"); if (parseInt(x) != NaN) alert("Only use letters!"); couldn't find a better way, this will only return an error if the whole string is just a number

2nd Mar 2018, 4:47 PM

ReimarPB

+ 2

3rd Mar 2018, 4:29 AM

Michael Ehab Mikhail

+ 1

@ReimarPB @Dondon Bragais Put it between <script></script> tags or in Javascript secrion in code playground in sololearn

2nd Mar 2018, 4:48 PM

Michael Ehab Mikhail

+ 1

@ReimarPB your answer is very good but he asks about this functionlity in textbox not in a prompt 👍

2nd Mar 2018, 4:51 PM

Michael Ehab Mikhail

+ 1

@Maykel Ehab oh oops, I didn't realize that 😅 You can still use line 2 of my example though, if the x variable is the value of the textbox

2nd Mar 2018, 4:53 PM

ReimarPB

+ 1

Thank you both for answering my question. I didn't expect a quick response from here. Thank you. Also I dont know how to mention names here so I can't address you both properly hahah Peace

2nd Mar 2018, 4:53 PM

Dondon Bragais

+ 1

You Are Welcome @Dondon Bragais just write @ followed by the name of the person you want to mention him 👍

2nd Mar 2018, 4:54 PM

Michael Ehab Mikhail

+ 1

Okay. Thanks again @Maykel Ehab and @ReimarPB

2nd Mar 2018, 4:56 PM

Dondon Bragais

+ 1

@th3_c0d3r he want the input type to be letters only not numbers

2nd Mar 2018, 5:59 PM

Michael Ehab Mikhail

+ 1

@Maykel Ehab <script type ="text/template" id = "player-list-template"> $(document).ready(function(){ $("#YOURTEXTBOXID").keypress(function(event){ var inputValue = event.which; if(!(inputValue >= 65 && inputValue <= 120) && (inputValue != 32 && inputValue != 0)) { event.preventDefault(); } }); }); <input id ="text-player" type="text" placeholder="add a person.." > <ul id ="player-list"> </ul> </script> Where shoul I put the code you gave me. It seems to be not working where I put it XD

2nd Mar 2018, 11:45 PM

Dondon Bragais

+ 1

i think you just forgot to replace #YOURTEXTBOXID by the id of your text box so i edited it for you

3rd Mar 2018, 4:32 AM

Michael Ehab Mikhail

Oh wow thanks! Should I put it below the closing tag of the </head> or should I put it below the <body>? Sorry I just started learning JavaScript

2nd Mar 2018, 4:47 PM

Dondon Bragais

@Maykel sorry, my mistake

2nd Mar 2018, 6:16 PM

Nura Programmer