Custom Form Navigation

Custom Form Navigation

By default, every Form you create has 4 x customisable navigation buttons in the top navigation bar.

Buttons Left1 and Left2 are (by default) assigned as EXIT and Quick Sync, respectively. You can, of course, edit these buttons as you see fit.

Buttons Right1 and Right2 were traditionally associated with in-app page navigation, with Right1 used to navigate back one page and Right2 used to navigate forward one page; you now have the option to assign any user action to these buttons.

For some Forms, however, this sequential navigation is not ideal since the user needs to be able to jump around the Form as they fill it out.

For example, if a user was performing a house inspection, they might fill out a “bedroom” page, then a “bathroom” page, and then need to fill out another bedroom.

This becomes tedious if the user has to keep moving back or forward to find the pages they need to fill out.

The solution is to add your own navigation buttons.

You add the buttons using the User Action field type available in the Form Designer, which lets you drop buttons onto any Form page.

Let’s go through a simple example.

We assume you already have an existing Form which has some pages in it.  If you don’t, create one and add some pages and fields.

Make sure you have your Form open in the Form Designer before proceeding below:

Generally, the idea is to have a “menu” page (usually the first page in your Form), which will have a set of buttons of it.

Each button will jump the user to a specific page in the Form.

Go ahead and add a page to your form now:

  • Set the data name of the page to be something like “menu”.
  • Now add a User Action button for each of your form’s pages.
    On each of these buttons:
  • Set the title of the button to be the name of that page – e.g. “Bedroom”, “Bathroom” etc.
  • Set the interaction property to the “Jump to Page” option, and then specify the target page in your form to jump to.

The above is an example of what your navigation buttons could look like

Step 1 – Add Action button

Step 2 – Set interaction to “Jump to Form Location”

Step 3 – Specify the page that the user should jump to when they click on the respective action button

Now, on each of your Form’s pages, you need to add buttons which jump the user back to the “menu” page.

To add these buttons, make use of the User Action field type, which lets you drop buttons on your form.
It’s usually best to put these buttons at the bottom of each page, but placement is up to you.

On each of these User Action buttons:

  • Set the title to be something like “Back to Menu”
  • Set the interaction property to the “Jump to Page” option, and then specify your “Menu” page from Step 1. above.
    This means that the user will be able to jump back to the Menu page from each of your pages.

Depending on your design, you might also want to add a “Finish” button on each page, which will jump the user to the end of the Form.

To do this, simply pick the “End of Form” option under the list of pages to jump to when you set the interaction property on the button.

You can also use the “Upload Form” interaction option if you want to skip the end of Form splash screen completely.

Remember, all Form navigation is up to you – so make sure there is a way for your users to actually be able to navigate and submit their Form entries as conveniently as possible.

    • Related Articles

    • Allowing Users to Jump Pages (Custom Form Navigation)

      By default, every Form you create has automatic navigation buttons in the form of arrows that appear at the top of your Form in the title bar of the app. These buttons let the user advance forward one page or backward by one page at a time. The user ...
    • Custom Icon Sets & Styling

      Our platform offers icon customization options from a selection of built-in sets and the capability to upload your custom images as icons. Icon customization can be done at two levels, depending on your account setup. For most accounts, this is done ...
    • Form Settings

      On a Form’s Settings page, numerous properties and options can be updated and set after the form is created. These range from Basic Settings, like the form’s title and how long the device keeps submitted entries in history, to Advanced Options for ...
    • Customizing Form Navigation

      Configure up to 4 navigational buttons to control in-app behavior on all screen types (Data Entry, Listing, Details, Mapping, and Board of Icons). When viewing a screen’s design, click the title/navigation bar to display its properties on the ...
    • SQL Form Connectors – Custom SQL

      There are two ways to control the flow of data to your SQL tables using one of our SQL form connectors (SQL Server, MySQL, or PostgreSQL): “Auto Maintain” and “Custom SQL“. In this article, we’ll look at “Custom SQL” and how you can use it in your ...