Develop Reference

Jquery - IF-ELSE logic doesn't work

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)) {

Backspace key issue in firefox

I have an text box and applied Allow Alphabets With Space only using jquery. Its working in chrome But in firefox the backspace key is not working.
<input type="text" placeholder="" id="id1">
$(function(){
$('#id1').keypress(function (event) {
if ((event.which >= 65 && event.which < 91) || (event.which > 96 && event.which < 123) || event.which === 32 || event.which===0) {
return true;
}
else {
event.preventDefault();
}
})});
Here it is Plnkr

It is a difference in how the browsers handle the backspace character. In Chrome, backspace never makes it to the keypress event handler, but in Firefox it does.
If you add || event.which === 8 to your conditional, you'll allow backspace and return true, which will get it working in Firefox.
EDIT: Arrow Up, Down,Left, Right and Tab also doesn't work in firefox.
var ignoredKeys = [8, 9, 37, 38, 39, 40];
if (ignoredKeys.indexOf(event.which) >=0 || (event.which >= 65 && event.which < 91) || (event.which > 96 && event.which < 123) || event.which === 32 || event.which===0) {
return true;
} else {
event.preventDefault();
}

This should work in all [major] browsers:
$('#id1').keydown(function (event) {
if (event.which == 8) {
// ...
} else {
event.preventDefault();
}
);
Note the use of keydown instead of keypress, which is essential for it to work.

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;

Restrict to numeric values rather than integer values

How do I restrict input fields to numeric values rather than integer values?
<input type="text" class="numericOnly">
jQ
$(".numericOnly").keypress(function (e) {
if (String.fromCharCode(e.keyCode).match(/[^0-9]/g)) return false;
});

Try this
$(".numericOnly").keypress(function(e) {
var code = e.which;
if(($(this).val().indexOf(".") == -1 && code == 46) || (code >= 48 && code <= 57) || (code == 51) || (code == 8) || (code >= 37 && code <= 40))
{
return true;
}
return false;
})
.bind("paste",function(e) {
e.preventDefault();
});

If you want to allow decimal points, add them to the character class you're using. E.g. /[^0-9.]/g if a decimal point in your locale is ., or /[^0-9,]/g if it's , (as it is in some).
Of course, that would let someone type .0.0.0.1, you'll want whole-value checks on the field as well as keystroke-level checks.
Separately, remember there are lots of ways for values to get into fields other than typing (pasting, for instance), so (again) whole-value checks at some stage will be a good idea.
Side note: Use e.which, not e.keyCode. jQuery normalizes the event object, setting e.which on browsers that don't set it natively.

With Dot
Get this js file
http://thefitties.co.uk/js/plugins/jquery-numeric.js
And
In HTML
<input class="numeric" type="text">
in Script
$("input.numeric").numeric()
WITHOUT DOt
$(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
(e.keyCode >= 35 && e.keyCode <= 39)) {
// 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();
}
});
});
OR
http://jsfiddle.net/lesson8/HkEuf/1/

validation not working in Firefox but works in IE,Chrome

I use the following java script function for integer validate which means the text box can allow to enter only the integer values alone.*It was work fine in Internet explorer and google chrome*.But I use this same function in FireFox the text box didn't allow to enter any characters in that which means it doesn't allow characters,numbers,space,anything else..How to solve this problem?
javascript function
$('.intValidate').live('keypress', function(event) {
var integervalidate = intValidate(event);
if (integervalidate == false)
return false;
});
function intValidate(event) {
if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 ||(event.keyCode == 65 && event.ctrlKey === true) ||(event.keyCode >= 35 && event.keyCode <= 39))
{
return;
}
else
{
if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 ))
{
event.preventDefault();
}
I use the class like,
<input type="text" id="abcd" style="width:30px" maxlength="2"class="intValidate""/>

Your problem is the inconsistent way that browsers use the keypress event.
Read this post to get a good explanation with an example of a work around.

You're examining keycodes in the keypress event. You should be looking at charCode values instead.