JS: Change tab order of fields on a WebForm
Tab index defines the order in which form elements will receive focus when navigated by the user via the keyboard.
fields. This is usually used for a multi-column Web Form. A typical situation is, on a two-column Web Form with ‘Top to bottom’ fill order, you would like to change the tab index order from ‘Left to right’ to ‘Top to bottom’.Implementation:
This solution can be used "as-is", without any changes if
a. It is used in a Capture Web Form
b. The fields First_Name
exist in the WebForm
c. The tab index will be set into First_Name >> Last_Name >> Email >> Phone_Number.
To use this solution,
a. Highlight Header_code provided in the text area shown below and copy it. Paste it inside the HTML Header section of the Capture Web Form using the Caspio Bridge DataPage Wizard, and
b. Highlight Footer_code provided in the text area shown below and copy it. Paste it inside the HTML Footer section of the Capture Web Form using the Caspio Bridge DataPage Wizard.
Footer Code:Tips for Customization
a. To use this script with different field names, change the occurrences of “First_Name”, “Last_Name”, “Email” and “Work_Phone” in the script to the appropriate field names.
b. To use this script in an Update WebForm or a Details page of a Search and Report DataPage, replace the prefix “InsertRecord” with “EditRecord” in the code. Tested Browsers
• MS Windows - IE 8.0, Firefox 3.6.3, Chrome 4.1, Safari 4.0.5
• Macintosh - Firefox 3.6.3, Safari 4.0.3Disclaimer: