A long time ago if found some code (on this site) that stopped the user from entering Letters into a text box, and it worked. Since finding this code I have changed it and added and now it doesn't work. This is what code I have:
var count = 1
function isNumberKey(event) {
var keyCode = window.event ? event.keyCode : event.which;
if (event.keyCode === 8 // backspace
|| event.keyCode === 46 // delete
|| event.keyCode === 13 // enter key
|| event.keyCode === 9 // tab
|| event.keyCode === 116 // F5 (refresh)
|| event.keyCode === 112 // F1
|| event.keyCode === 113 //F2
|| event.keyCode === 114 //F3
|| event.keyCode === 115 //F4
|| event.keyCode === 117 //F6
|| event.keyCode === 118 //F7
|| event.keyCode === 119 //F8
|| event.keyCode === 120 //F9
|| event.keyCode === 121 //F10
|| event.keyCode === 122 //F11
|| event.keyCode === 123 //F12
) {
return true;
}
else if ( key < 48 || key > 57) {
if (count < 6) {
count++; //adds one to count
}
else {
alert("Please Only Enter Numerical Values");
count = 1;
}
return false;
}
else return true;
}
I'm not claiming I made/wrote this code but can anyone see any problems with the code?
This will work. It was not working because you use key < 48 || key > 57 instead event.keyCode < 48 || event.keyCode > 57
var count = 1
function isNumberKey(event) {
var keyCode = window.event ? event.keyCode : event.which;
if (event.keyCode === 8 // backspace
|| event.keyCode === 46 // delete
|| event.keyCode === 13 // enter key
|| event.keyCode === 9 // tab
|| event.keyCode === 116 // F5 (refresh)
|| event.keyCode === 112 // F1
|| event.keyCode === 113 //F2
|| event.keyCode === 114 //F3
|| event.keyCode === 115 //F4
|| event.keyCode === 117 //F6
|| event.keyCode === 118 //F7
|| event.keyCode === 119 //F8
|| event.keyCode === 120 //F9
|| event.keyCode === 121 //F10
|| event.keyCode === 122 //F11
|| event.keyCode === 123 //F12
) {
return true;
}
else if ( event.keyCode < 48 || event.keyCode > 57) {
if (count < 6) {
count++; //adds one to count
}
else {
alert("Please Only Enter Numerical Values");
count = 1;
}
return false;
}
else return true;
}
this should do it:
textBox.onkeypress = function(e) {
e = e || window.event;
var charCode = (typeof e.which == "undefined") ? e.keyCode : e.which;
var charStr = String.fromCharCode(charCode);
if (/\d/.test(charStr)) {
return false;
}
};
This came up when I was asking, so it might be worth adding here that keyCode and charCode is deprecated, as at this time, so the accepted answer might not be the best.
A better way of adding the check or implementing the isNumberKey function could be:
const isNumberKey = (event: KeyboardEvent) =>
((event.key.length > 1) || event.key.match(/^\d|-$/))
This way, we check allow special keys do their function, while making sure only numbers are allowed when single character keys are pressed.
Related
This question already has answers here:
keyCode values for numeric keypad?
(13 answers)
Closed 1 year ago.
$('#cnic1').keydown(function(){
if (event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 ||
event.keyCode == 13 || (event.keyCode == 65 && event.ctrlKey === true) )
return;
if((event.keyCode < 48 || event.keyCode > 57))//0-9
event.preventDefault();
var length = $(this).val().length;
if(length == 5 || length == 13)
$(this).val($(this).val()+'-');
});
My problem is that this code only runs in response to the numbers entered at the top of the keyboard, but does not run in response to numbers entered from the numeric keypad.
I'm thinking the answer must be that the numeric keypad has different keyCode values, but how do I find out what those are?
The numeric keypad does have different keyCode values. The following link gives a full table of keyCodes for your reference:
https://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes
Use this code and press the keys. keycodes will be on console log;
window.onload = function(){
addEventListener("keydown",function(e){
console.log(e.keyCode);
});
}
Change if condition as
if((event.keyCode < 48 || event.keyCode > 57)&&(event.keyCode < 96 || event.keyCode > 105))//0-9
$('#cnic1').keydown(function() {
if (event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 ||
event.keyCode == 13 || (event.keyCode == 65 && event.ctrlKey === true))
return;
if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105)) //0-9
event.preventDefault();
var length = $(this).val().length;
if (length == 5 || length == 13)
$(this).val($(this).val() + '-');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="cnic1">
I have this function for checking text box value for entering only integer values.
function CheckNumeric(e) {
if (window.event) // IE
{
if ((e.keyCode < 48 || e.keyCode > 57) & e.keyCode != 8) {
event.returnValue = false;
return false;
}
}
else { // Fire Fox
if ((e.which < 48 || e.which > 57) & e.which != 8) {
e.preventDefault();
return false;
}
}
}
In this function textbox can accept 0 for value and reject any character.
Now I want to change this function to reject 0 if it is entered as the first character.
For example reject this: 010 and accept this: 10
you need to check if (e.keyCode == 48 && input.value.length == 0) then return false;
input is your text box element.
something like this
if (window.event) // IE
{
if (((e.keyCode < 48 || e.keyCode > 57) & e.keyCode != 8) || (e.keyCode == 48 && input.value.length == 0)) {
event.returnValue = false;
return false;
}
}
and it should be
(e.keyCode < 48 || e.keyCode > 57) && e.keyCode != 8)
instead of
(e.keyCode < 48 || e.keyCode > 57) & e.keyCode != 8)
i have a javascript code like below,
if (event.keycode != 37 && event.keycode != 39)
{
var phoneNumber = $('#phoneNumber').val();
if (phoneNumber.length < 1 && event.keyCode != 48)
$('#phoneNumber').val(0)
else if ((phoneNumber.length < 2 && event.keyCode == 48) )
event.preventDefault();
else
$('#phoneNumber').val(phoneNumber)
}
keycode 37 = left arrow, keycode 39 = right arrow but when i pressed these keys on keyboard condition which is between if block being executed, i am using chrome browser, also i used the if statement below,
if (event.keycode != 37 || event.keycode != 39)
{
var phoneNumber = $('#phoneNumber').val();
if (phoneNumber.length < 1 && event.keyCode != 48)
$('#phoneNumber').val(0)
else if ((phoneNumber.length < 2 && event.keyCode == 48) )
event.preventDefault();
else
$('#phoneNumber').val(phoneNumber)
}
urgent helps greatly appreciated,
Thanks everybody.
One issue is capitalization: it's keyCode, not keycode. Your code is using them inconsistently.
I'm trying to set up some keycodes for an app I'm working on but it really drives me crazy.
I'm trying to set up keycodes which would say, from keyCode 65 to 91 , 44 , 47 and few others, do function.
So I have this:
var e = event || evt;
if ((e.keyCode > 65 || e.Keycode < 91)){
// Do function
}
which works find. Now if I try to add another keycode it doesn't work.
This is what I tried:
if ((e.keyCode > 65 || e.Keycode < 91) && (e.keyCode == 44) && (e.keyCode == 47)){
Does someone help me to add different keycodes in one If statement?
Thanks alot
Try this
if (
// get all the keys between 65-90
(e.keyCode >= 65 && e.keyCode <= 90)
// or 44 or 47
|| e.keyCode == 44 || e.keyCode == 47)
{
// do stuff
}
If the conditional logic is tripping you up, I think you might be best served by thinking about the numbers you want to include (not exclude). Break them into ranges and put each range on its own line. Start with pseudo code:
if
// keys between 31-47
// or keys between 58-90
then
// do stuff
end
Then fill in the conditions:
if (
// keys between 31-47
(e.keyCode >= 31 && e.keyCode <= 47)
// or keys between 58-90
|| (e.keyCode >= 58 && e.keyCode <= 90)
)
{
// do stuff
}
If you want everything from 31 to 90 except for those from 48 through 57:
if (e.keyCode >= 31 && e.keyCode <= 90 && !(e.keyCode >= 48 && e.keyCode <= 57)) {
// whatever
}
Now that could be written equivalently as:
if (e.keyCode >= 31 && e.keyCode <= 47 || e.keyCode >= 58 && e.keyCode <= 90) {
// whatever
}
if ((e.keyCode > 65 && e.Keycode < 91) || e.keyCode == 44 || e.keyCode == 47){
//do stuff
}
I found the following jQuery code on the internet, but I soon found that it had a deficiency in that it dit not accept a decimal point (ascii code 46) - even though the code appears to allow it.
Currently, I cannot enter prices like 1.23, since the the period is ignored and I get 123 instead.
Can anyone spot whty this is not working?
// Numeric only control handler
$.fn.ForceNumericOnly =
function()
{
return this.each(function()
{
$(this).keydown(function(e)
{
var key = e.charCode || e.keyCode || 0;
// allow backspace, tab, delete, arrows, numbers and keypad numbers ONLY
return (
key == 8 ||
key == 9 ||
key == 46 ||
(key >= 37 && key <= 40) ||
(key >= 48 && key <= 57) ||
(key >= 96 && key <= 105));
})
})
};
I am using the plugin like this:
$(function(){
$('#price_field').ForceNumericOnly();
});
The other users have pretty much answered your question already, but I wanted to provide you with this link.
http://unixpapa.com/js/key.html
I found it quite useful when dealing with keyboard events and making them cross-browser compatible.
I hope this helps.
Just add the . (code 190 and 110) to the checks:
// Numeric only control handler
$.fn.ForceNumericOnly =
function()
{
return this.each(function()
{
$(this).keydown(function(e)
{
var key = e.charCode || e.keyCode || 0;
// allow backspace, tab, delete, arrows, numbers and keypad numbers ONLY
return (
key == 8 ||
key == 9 ||
key == 46 ||
key == 190 || // normal .
key == 110 || // keypad .
(key >= 37 && key <= 40) ||
(key >= 48 && key <= 57) ||
(key >= 96 && key <= 105));
})
})
};
You should add the key code 190 to accept "."
// Numeric only control handler
$.fn.ForceNumericOnly = function() {
return this.each(function()
{
$(this).keydown(function(e)
{
var key = e.charCode || e.keyCode || 0;
// allow dot, backspace, tab, delete, arrows, numbers and keypad numbers ONLY
return (
key == 190 ||
key == 8 ||
key == 9 ||
key == 46 ||
(key >= 37 && key <= 40) ||
(key >= 48 && key <= 57) ||
(key >= 96 && key <= 105));
})
})
};
You need to include 190 and 110 for both decimal points.
// Numeric only control handler
$.fn.ForceNumericOnly =
function()
{
return this.each(function()
{
$(this).keydown(function(e)
{
var key = e.charCode || e.keyCode || 0;
// allow backspace, tab, delete, arrows, numbers and keypad numbers ONLY
return (
key == 190 || //add this line. 190 is the keycode for a period
key == 110 || //and this line. 110 is the keycode for a decimal
key == 8 ||
key == 9 ||
key == 46 ||
(key >= 37 && key <= 40) ||
(key >= 48 && key <= 57) ||
(key >= 96 && key <= 105));
})
})
};