Jquery - IF-ELSE logic doesn't work - javascript

I am trying to write a jquery function that controls user input of a texfield (for currency) based on locale. The alert did tell me that the german locale is "de". But the if-else logic does not work. The preventDefault() for the specific keycodes work just fine without the if-else. Can someone please tell me what it is that i am doing wrong here?
jQuery(function($) {
$('.currency').on('keydown', function(e) {
var locale = $('#currFormat').val();
//alert(locale);
if (locale.toLowerCase() === "de" ) {
console.log(e.keyCode);
if (e.keyCode !== 46 && e.keyCode > 31 && e.keyCode !== 96 && e.keyCode !== 97 && e.keyCode !== 98 && e.keyCode !== 99 && e.keyCode !== 100 && e.keyCode !== 101 && e.keyCode !== 102 && e.keyCode !== 103 && e.keyCode !== 104 && e.keyCode !== 105 && e.keyCode !== 188 e.keyCode !== 37 && e.keyCode !==39 && (e.keyCode < 48 || e.keyCode > 57)) {
//stop all non-numbers
e.preventDefault();
} else {
// Here goes logic for not allowing comma and others (,)
}
});
});
The 'amount' value comes from the JSP.
<input type="hidden" id="CurrFormat" name="currFormat"
value="${pageContext.request.locale.language}" />

You have a typo. So technically you are selecting the element that is not present on the page.
$('#currFormat').val();
is supposed to be
$('#CurrFormat').val();
Also is this a copy paste error as well
e.keyCode !== 188 e.keyCode !== 37 --> missing logical && between expressions
Also the reason it is easy to make a syntax error is because the code is not readable at all. Instead you can condense it and make it simpler.
var keyCode = e.keyCode;
var invalidKeyCodes = [37, 39, 46, 96, 97, 98, 99, 100, 101. 102, 103, 104, 105, 188];
if (invalidKeyCodes.indexOf(keyCode) < 0 && keyCode > 31 && (keyCode < 48 || keyCode > 57)) {

Related

How can I force numbers only on a dynamically created field?

I am trying to restrict a dynamic field to numbers only but if I try:
$(document).on('keydown', '.numberOnly', function() {
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 || (e.keyCode == 65 && (e.ctrlKey ===
true || e.metaKey === true)) || (e.keyCode >=
35 && e.keyCode <= 40)) {
return;
}
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode >
57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
But it doesn't work. it does work if I replace the top line with:
$(".numberOnly").keydown(function(e) {
however, that only works for static fields.
Your method looks just fine, and should work correctly. There was one small typo that you left out the EventObject e from the delegated event binder ( but included it in the direct event binder, which is why it worked ).
Changing the first line to:
$(document).on('keydown', '.numberOnly', function(e) {
should fix your problem

isNumberKey() not working

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.

JQuery to allow only numeric input in text box using key code

I am trying to allow only numbers [0-9] to be typed in a text box. If an alpha or special character is typed, I do not want it to be shown in the text box. Currently my code is as follows:
$('#TEXTBOX').on("keydown", function(event){
var keyCode = event.which;
if(!((keyCode > 47 && keyCode < 58) || (keyCode > 95 && keyCode < 106) || keyCode == 08)){
event.preventDefault();
}
});
I am having a few problems.
This function is still allows special characters [i.e (SHIFT + 1) gives !, (SHIFT + 2) gives #] I do not want these key combinations to allow insert into text box
I am using magic numbers. I would prefer not to use magic numbers and logic but this is the only way I was able to get the input validation to work.... are there any suggestions on other methods?
My main concern is my first problem with the special characters.
$('#TEXTBOX').on("keydown", function(event){
var keyCode = event.which;
var charCode = (event.charCode) ? event.charCode : ((event.keyCode) ? event.keyCode: ((event.which) ? evt.which : 0));
var char = String.fromCharCode(charCode);
var re = new RegExp("[0-9]", "i");
if (!re.test(char))
{
event.preventDefault();
}
});
Use as
$('#TEXTBOX').on("keydown", function(event){
if(event.shiftKey)
return false;
var keyCode = event.which;
if(!((keyCode > 47 && keyCode < 58) || (keyCode > 95 && keyCode < 106) || keyCode == 08)){
event.preventDefault();
}
});
$(document).ready(function() {
$("#txtboxToFilter").keydown(function (e) {
// Allow: backspace, delete, tab, escape, enter and .
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
// Allow: Ctrl+A
(e.keyCode == 65 && e.ctrlKey === true) ||
// Allow: home, end, left, right, down, up
(e.keyCode >= 35 && e.keyCode <= 40)) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
});
Worked For me (Only Numbers are allowed)
var key = e.charCode || e.keyCode || 0;
alert(key);
if (key < 48 || key > 58)
return false;

If-statement triggering despite not every condition met

I've got this if condition:
(48 - 57 are the typewriter numerics, 96 - 105 apply to the numeric keypad)
if((e.ctrlKey && e.altKey) && ((e.keyCode > 47 && e.keyCode < 58)) || (e.keyCode > 95 && e.keyCode < 106)){
console.log(e.altKey);
}
This is working well if i do not use the numeric keypad but the typewriter keys instead.
However, if i press ctrl + any number on the numeric keypad, the condition will trigger and output false to the console
How can that be?
did you mean?
(e.ctrlKey && e.altKey) && ((e.keyCode > 47 && e.keyCode < 58) || (e.keyCode > 95 && e.keyCode < 106))
Can you try this :
if (
( e.ctrlKey && e.altKey )
&& (
(e.keyCode > 47 && e.keyCode < 58)
|| (e.keyCode > 95 && e.keyCode < 106)
)
)
{
console.log(e.altKey);
}
You had a ) after < 58 wich was not on good place

jQuery/JS Keycodes: Several keycodes in one IF statement

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
}

Categories

Resources