Tab key does not work

Question

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/

Answer 1

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.

Answer 2

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;
    }