Fix Tabindex Issue In Registartion/SignUp Forms

Share Now

#Issue:
When user navigates the registration form using TAB key from one field to the next one, after he enters the password, he presses TAB and it shifts focus to “Show password” instead of “Confirm password” – this can lead to user not noticing and start typing the password again and clicking the submit button etc. To avoid confusion it is better to increase the tab order of these “show password” controls to last order.

#CODE EXAMPLE:

document.getElementById("myAnchor1").tabIndex = "3";
document.getElementById("myAnchor2").tabIndex = "2";
document.getElementById("myAnchor3").tabIndex = "1";

#How did I fix it on this particular issue:

document.querySelector("a.password_preview").tabIndex = "-1";

This how it will work after fix

Picture of Nahid Mahamud

Nahid Mahamud

Web Developer | Graphic Designer | WordPress & Woo-commerce Expert