0

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

2nd Mar 2018, 4:22 PM
Dondon Bragais
Dondon Bragais - avatar
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
Michael Ehab Mikhail - avatar
+ 3
I recommend placing JavaScript at the end of <body> like this: <html> <head> </head> <body> <!-- html code here --> <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
ReimarPB - avatar
+ 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
ReimarPB - avatar
+ 2
<script type ="text/template" id = "player-list-template"> $(document).ready(function(){ $("#text-player").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> Add This In body section in html code
3rd Mar 2018, 4:29 AM
Michael Ehab Mikhail
Michael Ehab Mikhail - avatar
+ 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
Michael Ehab Mikhail - avatar
+ 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
Michael Ehab Mikhail - avatar
+ 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
ReimarPB - avatar
+ 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
Dondon Bragais - avatar
+ 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
Michael Ehab Mikhail - avatar
+ 1
Okay. Thanks again @Maykel Ehab and @ReimarPB
2nd Mar 2018, 4:56 PM
Dondon Bragais
Dondon Bragais - avatar
+ 1
@th3_c0d3r he want the input type to be letters only not numbers
2nd Mar 2018, 5:59 PM
Michael Ehab Mikhail
Michael Ehab Mikhail - avatar
+ 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
Dondon Bragais - avatar
+ 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
Michael Ehab Mikhail - avatar
0
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
Dondon Bragais - avatar
0
@Maykel sorry, my mistake
2nd Mar 2018, 6:16 PM
Nura Programmer
Nura Programmer - avatar
0
@th3_c0d3r don't worry 😄
2nd Mar 2018, 6:17 PM
Michael Ehab Mikhail
Michael Ehab Mikhail - avatar
0
@Maykel Ehab Thank you so much. I'll try it when I get home
3rd Mar 2018, 6:42 AM
Dondon Bragais
Dondon Bragais - avatar