CODEWITHSUNDEEP
jquery
input
input

Reputation: 7519

Tab key does not work

I'm using this code to stop the user from entering numeric values into the textboxes:

$('input[type=text]').keydown(function(event) {
    // Allow only backspace and delete
    if (event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 190) {
        // let it happen, don't do anything
    }
    else {
        // Ensure that it is a number and stop the keypress
        if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105)) {
            event.preventDefault();
        }
    }
});

However, this stops the tab key from focusing on the next textbox. If I add this code to the keydown event, the tab key works, but the user cannot enter any value in the textbox at all and the tab key will only focus on the immediate next box. After that, it does not go to the next box, when tab key is pressed again. 

var code = event.keyCode || event.which;
if (code == 9) {
    alert ("Tab key pressed");
}
return false;

Here's the code at jsfiddle: http://jsfiddle.net/N7BWF/1/

Upvotes: 2

Views: 1642

Answers (2)

Joseph Marikle
Joseph Marikle

Reputation: 78520

Place your code snippet with the 9 at the start of the function, and make the executed code in the if block return true;

http://jsfiddle.net/52LUt/

    var code = event.keyCode || event.which;
    if (code == 9) {
        return true;
    }

Upvotes: 0

Rob W
Rob W

Reputation: 348972

if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105))

This line of code includes 9 (tab). You have to add && event.keyCode != 9 to the if-condition if you want to enable tab.

Upvotes: 3

Related Questions