• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

8. Dynamic Forms > 8.12. Auto-Tabbing for Fixed-Length Text Boxes

Auto-Tabbing for Fixed-Length Text Boxes

NN 4, IE 4

Problem

You want to advance the text cursor from one field to the next in a sequence of fixed-length boxes.

Solution

The following form excerpt requests the customer’s credit card number in four segments of four characters each:

Credit Card Number:
<input type="text" name="cc1" size="5" maxlength="4" 
    onkeypress="return numeralsOnly(event)" 
    onkeyup="autofocus(this, 4, 'cc2', event)">&nbsp;&nbsp;
<input type="text" name="cc2" size="5" maxlength="4" 
    onkeypress="return numeralsOnly(event)" 
    onkeyup="autofocus(this, 4, 'cc3', event)">&nbsp;&nbsp;
<input type="text" name="cc3" size="5" maxlength="4" 
    onkeypress="return numeralsOnly(event)" 
    onkeyup="autofocus(this, 4, 'cc4', event)">&nbsp;&nbsp;
<input type="text" name="cc4" size="5" maxlength="4" 
    onkeypress="return numeralsOnly(event)">

PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint