rollingthedice
rollingthedice

Reputation: 1125

Prevent quick usage of tab key?

I have a functionality which forbids users to input specific symbols into <input> tags and also convert all alphabet characters to uppercase.

Everything worked fine when I found out this bug with fast tabbing between elements.

Problem:

Whenever a user inputs a character and presses the tab key really fast, the last character won't get converted to upper case.

Note:

I still want to let users tab between inputs so just e.preventDefault() is not an option here. I need to slightly slow down the tab action with 20-30 milliseconds or so.

Code:

var $inputs = $('input[type="text"]');

$inputs.on('keyup keydown keyhold paste', function(e) {
    //validate_input will return true if character is allowed and transformed into upper case
    if (!validate_input(e, $(this))) {
        return false;
    }

    if (e.which == 9) {
       // i need to do something here to slightly slow down the tab process
       // just to make sure the above function will execute before the default tab action.
    }
});

Upvotes: 1

Views: 125

Answers (1)

some
some

Reputation: 49582

I suggest that you use input-event instead. That is fired when the value has changed. You can do you filtering of allowed values there, and convert it to upper case. That is a much easier, foolproof, less buggy, browser independent, keyboard independent, assistive technology independent, approach to solve your problem.

Upvotes: 2

Related Questions