Understand field navigation | Zoho Creator Help

Understand field navigation

What Does This Page Cover?

Learn about navigating your Creator fields using the TAB key and also a combination of arrow keys with special keys (Option key on Mac or the Alt key on Windows), thereby making it easier and beneficial to users who prefer the keyboard over the mouse in terms of accessibility. The combination of navigating using arrow keys and special keys is referred to as four-way navigation.

Availability

Field navigation using TAB key and combination of arrow keys with special keys :
- is available in all the data centers.
- is supported in all browsers.
- can be accessed in both free and paid pricing plans of Creator.
- can only be enabled by the super admin, admins, and developers, while other users can navigate through the form fields using the TAB key in the chosen direction (top to bottom or left to right).

Overview

Field navigation refers to navigating through the fields within a form in your application in the preferred order during data entry process. In general, field navigation involves various techniques, such as using the TAB key or arrow keys, clicking on individual fields, or using keyboard shortcuts, to move from one field to the next in a logical and efficient manner. This keyboard accessibility benefits users who have limited dexterity with a mouse, and those who simply prefer or rely on the efficiency of a keyboard. 

Effective field navigation can help users save time and reduce errors when working with data-intensive applications.

Field navigation in Creator

  1. Navigation using TAB key
  2. Four-way navigation
Creator enables you (admin/super-admin) to allow your users to navigate across the form fields using the TAB key. When filling out a form, users typically encounter multiple fields that require specific information, such as a name, address, phone number, or email. 

Certain users might prefer the keyboard over the mouse to navigate through the form, as they might find it challenging to scan the screen and locate the field that currently has keyboard focus. Keyboard users typically use the TAB key to navigate through fields and enter the required data in your forms. As they navigate through the form, the order in which your form fields receive visible keyboard focus is essential and must be logical as well as intuitive. 

Tab order is the order or sequence that the cursor moves from field to field in a form. Initially, the tab order is determined by the order in which the fields are added to the form. As an admin or super-admin, you can define the exact order in which the fields must be tabbed using the below options, thereby enabling them to easily and efficiently navigate the form.  This tab order will be applied when editing or creating a new record.
  1. Vertical - The field focus moves from top to bottom through the fields. 
  2. Horizontal - The field focus moves left to right first and then top to bottom i.e., the navigation occurs in a 'Z' manner. After navigating towards the end of the row, the field focus moves down to the next row of fields in your form.
Users can go forward or right between fields by using the Tab key, and backward or left by using the Shift+Tab combination.  For forms with sections, users can either navigate through all columns for each row (from left to right ) and then move to the next row (top to bottom). Then, they can switch to the next section. 
The tab order can vary as per your form requirements. It is essential to choose an order that is on par with the visual flow of your form.

Four-way navigation 

Note: This navigation is not listed as a form property, but will work in your Creator applications' forms when users use the combination of keys, as mentioned below.
You can also move between fields in all four directions: up, down, left, and right. To do this, you can use the combination of up/down arrow keys or the left/right arrow keys with special keys, such as the Option key on Mac or the Alt key on Windows. This method of navigation enables users to navigate between form fields, sections, and multi-column layout more quickly and efficiently, especially in cases of forms with huge number of fields. This mode of navigation is essentially using the keyboard to reach the required field by pressing minimum number of keys. 
For forms with multiple fields, you can combine both types of navigation mentioned above to navigate with better ease. Let's assume you've created a form that contains a certain number of fields that include a combination of address, subform, and rich text fields. You're at the start of the form and wish to navigate quickly to a field that's at the end of the form. Here, you can use both the TAB key and a combination of arrow keys + Option/Alt keys to quickly navigate to the desired field at the bottom of the form.


See how it works

The below video shows how your users can navigate across form fields using the TAB key.



The below video shows how your users can navigate across form fields using a combination of arrow keys + Option key in Mac devices.


Use Cases

  1. Vertical tab order - This is the default option that allows your users to move from top to bottom of your form. Let's assume you've created an Apply Leave form for your employees. You can choose the Vertical option in this case as this form does not contain any sections and users can navigate the form fields in a linear manner.
  2. Horizontal tab order - When you've chosen the Horizontal option, you'll be able to navigate from left to right first, then only move below. Let's assume you've created a Reimbursement Details form containing three sections. You can move across the fields in each section from left to right, then move to the next section.

Enable field navigation

  1. Navigate to the edit mode of your Creator application.
  2. Open the builder of the required form.
  3. Click the Properties icon in the top-right of the form builder, as shown above. The Form Properties pane will appear on the right.

  4. Select the required option, Horizontal or Vertical, beneath Keyboard Navigation in the Appearance section. By default, the Horizontal option will be chosen.

  5. Access your app in live and use the TAB key to navigate across and between the form fields in the chosen order.

Things to Know

  1. Navigation using TAB key
  2. Four-way navigation
  1. To allows users to move horizontally (left to right) across your form fields, more than one section or column must be present in that form.
  2. You can navigate across all form fields and buttons using the TAB key.
  3. When utilizing a multi-column layout, form field navigation is determined by the arrangement of fields in the form builder, rather than their appearance in live mode.
  4. If you've enabled the RTL layout for your application and chosen the Horizontal option, then using the TAB key will move the focus on the fields from right to left, and not left to right.
  5. The default behavior for composite fields (name and address) and subform fields will be from left to right, irrespective of the tab order chosen.
  6. When using the TAB key for navigating form fields, fields such as radio, checkbox, and decision box will not be focussed i.e., you cannot navigate or choose the required options in the mentioned fields using the TAB key.
Disabled fields in your form will also be tabbed (focused) when navigating our form fields using the tab key.

Four-way navigation 

  1. This is a field-to-field mode of navigation. Using this navigation you can only navigate from one field to another field. If the field contains an icon (such as close or add icons in case of subform fields), you need to manually focus on the field input area. 
  2. If a field has more than one sub-field (such as name and address fields), the field focus will always be on the first sub-field of that field when you try to navigate to the next field with a sub-field.
  3. If you've configured form workflows (such as showing an info message upon executing that workflow), this navigation will not focus on the View log details area.
  4. This navigation will not focus on the Captcha field if you've checked the Enable Captcha form property.
  1. Understand forms
  2. Understand fields
  3. Add a field
  4. Localization


 

    Zoho CRM Training Programs

    Learn how to use the best tools for sales force automation and better customer engagement from Zoho's implementation specialists.

    Zoho CRM Training
      Redefine the way you work
      with Zoho Workplace

        Zoho DataPrep Personalized Demo

        If you'd like a personalized walk-through of our data preparation tool, please request a demo and we'll be happy to show you how to get the best out of Zoho DataPrep.

        Zoho CRM Training

          Create, share, and deliver

          beautiful slides from anywhere.

          Get Started Now


            Zoho Sign now offers specialized one-on-one training for both administrators and developers.

            BOOK A SESSION








                                    You are currently viewing the help pages of Qntrl’s earlier version. Click here to view our latest version—Qntrl 3.0's help articles.




                                        Manage your brands on social media

                                          Zoho Desk Resources

                                          • Desk Community Learning Series


                                          • Digest


                                          • Functions


                                          • Meetups


                                          • Kbase


                                          • Resources


                                          • Glossary


                                          • Desk Marketplace


                                          • MVP Corner


                                          • Word of the Day


                                            Zoho Marketing Automation

                                              Zoho Sheet Resources

                                               

                                                  Zoho Forms Resources


                                                    Secure your business
                                                    communication with Zoho Mail


                                                    Mail on the move with
                                                    Zoho Mail mobile application

                                                      Stay on top of your schedule
                                                      at all times


                                                      Carry your calendar with you
                                                      Anytime, anywhere




                                                            Zoho Sign Resources

                                                              Sign, Paperless!

                                                              Sign and send business documents on the go!

                                                              Get Started Now




                                                                      Zoho TeamInbox Resources



                                                                              Zoho DataPrep Resources



                                                                                Zoho DataPrep Demo

                                                                                Get a personalized demo or POC

                                                                                REGISTER NOW


                                                                                  Design. Discuss. Deliver.

                                                                                  Create visually engaging stories with Zoho Show.

                                                                                  Get Started Now









                                                                                                      • Related Articles

                                                                                                      • Understand Address Field Properties

                                                                                                        This page is applicable to all report types except pivot chart and pivot table. This field displays values that are valid addresses. Based on the predefined properties, the values displayed include or exclude certain information in the field. The ...
                                                                                                      • Understand field rules

                                                                                                        The script actions in the field rules event will help you in defining the behavior of the fields in the form. There are multiple actions which can be associated with the field rules event. They are: Show field - This will make the field visible to ...
                                                                                                      • Understand OCR field

                                                                                                        The OCR field enables you to perform optical character recognition on an image. In other words, it extracts text from the images stored in an image field. For example, you can use the OCR field to extract the text from the images of invoices, ...
                                                                                                      • Understand sentiment analysis field

                                                                                                        The Sentiment Analysis field enables you to determine if the sentiment of the text in a single line or multi line field is Positive, Neutral, or Negative. For example, you can find out the sentiment of your customer's feedback. As its value is ...
                                                                                                      • Understand keyword extraction field

                                                                                                        The Keyword Extraction field enables you to extract keywords from the text stored in a single line or multi line field. It use Zoho's Artificial Intelligence (AI) to analyze the text in the selected field and stores the output as comma - separated ...
                                                                                                        Wherever you are is as good as
                                                                                                        your workplace

                                                                                                          Resources

                                                                                                          Videos

                                                                                                          Watch comprehensive videos on features and other important topics that will help you master Zoho CRM.



                                                                                                          eBooks

                                                                                                          Download free eBooks and access a range of topics to get deeper insight on successfully using Zoho CRM.



                                                                                                          Webinars

                                                                                                          Sign up for our webinars and learn the Zoho CRM basics, from customization to sales force automation and more.



                                                                                                          CRM Tips

                                                                                                          Make the most of Zoho CRM with these useful tips.



                                                                                                            Zoho Show Resources