Cursor Movement to Form Fields

software development


Hi - Could anyone give me a clue on how to get the cursor to automatically move to the next field when a user is typing in a phone number that is broked down into 3 separate fields?
Thanks much,


Just ad the tabindex=“1”, tabindex=“2”…etc.



This can only be done with client-side scripting. You will need to test to see whether or not the correct number of digits have been entered into a field, and then set the focus to the next field.

Setting the focus in JavaScript is quite easy:

document.formname.fieldname.focus()You’ll need some sort of loop structure based upon an onchange() event; however, it would be much better (from an accessibility standpoint) to use only a single field for a telephone number.

Simon Jessey
Keystone Websites | si-blog


Not only should you not use three separate fields for the phone number, you should also ensure that you will accept a phone number with or without dashes, dots, or spaces. One of my big web usability pet peeves is web forms that require a certain formatting for things like phone and credit card numbers when it’s absolutely trivial to just take what’s entered and reformat it internally if it’s not how you want it.

If you want useful replies, ask smart questions.