Now we will be discussing how to navigate through a particular form. By default, you navigate through the form in the order in which elements appear in the form, using tab index attribute you can change this default order. Just place the tabindex attribute in the input field. Our sample form shows the following fields and they will be accessed in the order they are listed. Using the tabindex attribute the order will change. The following code shows the new order as below:
<HTML> <HEAD><TITLE> TEXT FIELDS</TITLE></HEAD> <BODY BGCOLOR="PINK"> <P ALIGN ="CENTER"><B>ADMISSION FORM</B></P> <FORM> <P> <INPUT TYPE ="TEXT' tabindex="30" NAME="NAME" VALUE="ENTER YOUR NAME:" SIZE="25" MAXLENGTH="30"> NAME<BR><BR> <INPUT TYPE ="PASSWORD" tabindex="20" NAME="PASSWD" SIZE="25" MAXLENGTH="30"> PASSWORD<BR><BR> <INPUT TYPE ="TEXT" tabindex="40" NAME="ADDRESS" SIZE="25" MAXLENGTH="30"> ADDRESS<BR><BR> <INPUT TYPE ="RADIO" tabindex="10" NAME="SEX" VALUE="MALE" CHECKED> MALE<BR> </FORM> </BODY> </HTML>
If two elements have the same tabindex value, the orders will be same as the default order i.e. in which they appear. You can also remove an input field from the tab navigation order by assigning it a negative tabindex value. This attribute can be used with INPUT, SELECT and TEXTAREA elements.
Dinesh Thakur holds an B.C.A, MCDBA, MCSD certifications. Dinesh authors the hugely popular