Tab Order Wizard
Business Background
Order your elements when using the Tab key to suit your business needs using Titan’s no-code web solution.
Titan Solution
Create custom tab orders in Titan Web in order to manage a large volume of input fields, buttons, elements in a web project, and more. By default, tabs are ordered according to the sequence in which an admin adds them to a layout.
How to Video
- 0:02 A brief introduction on how to use the tab order wizard with Titan Web.
- 0:08 Learn how to control the tab order on the screen.
- 0:21 Take in how tab order works.
- 0:47 Watch how to configure the tab order wizard settings.
- 0:55 Pick up on the demonstration of the auto tab order option from Titan Web
- 1:49 Learn how to set up a custom tab order option from Titan Web.
- 2:41 Discover how to add a new page to your Titan web project to view tab order options for multiple page projects.
How to Guide
The Tab Order Wizard custom tab order overrides the browser default.
The Tab Order Wizard lets you set the tab order per page as either automatic (the order that you added the inputs to the page) or custom.
Project Settings > Site Elements >Tab Order Wizard toggle button
You can use values greater than 0 or use values 0 and -1.
Configure a custom tab order
Here you will use values greater than 0.
- Click on the Tab Order Wizard toggle button to switch the option on.
- Click on the Tab Order Wizard Gear icon. The Tab Order Wizard screen opens.
- Select Auto tab order by clicking in the radio button. This is the automatic tab order of the web browser. You can set a custom tab order. Refer to step 4.
The tab order will be from 1 to the last number, in this instance, number 9. When the user presses the Tab key on the keyboard, this is the order that the tabbing will be done.
- Click in the Custom tab order radio button. In this example, the order will be as follows: Text field (1) > Radio button (2) > TextArea (3) > Checkbox (4) > Email (5) > Switch (6) > Time (7) > Slider (8) > Date (9).
When the user presses the Tab key on the keyboard, this is the order that the tabbing will be done: Text field (1) > Radio button (2) > TextArea (3) > Checkbox (4) > Email (5) > Switch (6) > Time (7) > Slider (8) > Date (9).
Ignore input fields
To ignore specific input fields when a user uses the Tab key on the keyboard, you can set a 0 and/or -1 value.
The value 0 will be ignored and the default tab order of the web browser will be used (last tab). The value -1 will be ignored completely.
In this example: Text field (1) > Currency (2) > Button group (3) > Lookup field (5) > Lookup field (6) > Multi-select picklist (7) > Text area (8) > Button (10) > Lookup field (11) > Drop-down field (4=0).
The URL field (9 = -1) will be ignored.
When the user presses the Tab key on the keyboard, this is the order that the tabbing will be done.
The drop-down field (4) is skipped at first because the number was equal to 0. The tab order will go to the drop-down field (4) after the other fields were tabbed to, in this instance, after the lookup field (11). A 0 value will ignore the tab order set up by the wizard and will use the default order of the web browser.
The URL field (9) is skipped completely because the number was equal to -1.
