Defining Pages

page designer edit page

Table of Contents


Overview

The Create Page screen facilitates the creation of new pages in your application. Attributes such as page name, type, splash screen sizing, and transition restrictions can be defined from this screen.


Page Features

The properties of a given page are modified from this screen. Below is a list of the properties and their respective effects upon your web application.


Name

The Name property of the page will have an effect on several facets of your application:

  • If the Navigation Bar Orientation property is set to either Top or Left, the name defined here will determine the name that is shown for the given page within the navigation bar.
  • When on a given page, the title of the page (found in the browser tab) will reflect the name of the associated page.

Page Icons

Page icons are small images that are placed to the left of the page name on the Navigation Bar. The selected icon is also displayed on the Pages menu in the Designer interface. You can add icons to pages from the Select Page Icon button. Simply select the icon you want to use, and press the OK button on the bottom of this menu. The selected icon will be displayed to the left of the page name when you review or publish your application. You can see the selected icon next to the Select Page Icon button. To remove an icon, press Remove Page Icon.


Mobile Navigation Bar Orientation

You can select a different type of navigation menu for your application to be used when it is accessed by a mobile device, or a device with a smaller screen.

  • None: No navigation bar will be displayed. Use this option if any navigation from or to this page will occur through button redirection.
  • Top: The navigation bar will be shown on the top of the mobile page.
  • Bottom: The navigation bar will be shown on the bottom of the mobile page in the form of a small icon that expands when you click it and shows the pages. This option will also allow you to enable or disable the Bottom Bar Show Only Icons property. When Bottom Bar Show Only Icon is enabled, the navigation menu will only display the page icons, and omit the page names.

Page Type

The Page Type property determines how the system will process that particular page in terms of rendering a UI, or redirecting the users clicking it.

There are two page types you can select from:

  • Standard: The page will be rendered as a standard web page as a part of the application.
  • Link: The page will act as an anchor used to redirect the user to an external URL.

Splash Screen Type

The Splash Screen Type property of a page will reflect in the sizing of the splash screen, which is the segment of the screen that displays when the application is processing (e.g. loading, calculating).

Note that modifying this value does not effect the initial startup of the application: to prevent confusion during the initial load, the fullscreen splash screen will be utilized. This prevents users from actively making modifications to existing inputs before the application is prepared for user interaction.

There are currently three options for displaying the splash screen:

  • None: No splash screen will be shown while processing.
  • Partial: A small splash screen will be visible in the bottom right corner of the user interface while the application is processing. This will not prevent user interaction or input while calculations are performed.
  • FullScreen: A large splash screen will be visible, covering the entire contents of the page, while the application is processing. The intention is to prevent further user interaction and input while calculations are performed.

This property is applicable to following page type(s):

  • Standard

Navigation Bar Orientation

The Navigation Bar Orientation property of a page will determine how to display your navigation menu to the end user while accessing the application. Setting this property affects only the target page. As a result, different pages can display the navigation menu in different orientations, all within the same web application.

This can aid in facilitating specific workflows, such as step-by-step entry via button redirection while still allowing the user to traverse back to earlier pages once they land on the final screen.

There are currently three options for displaying the navigation bar:

  • None: No navigation bar will be displayed. Use this option if any navigation from or to this page will occur through button redirection.
  • Top: The navigation bar will be present at the top of the page. Pages will be displayed as tabs from left to right in their sequential order. The Branding Image will appear to the left of the navigation bar.
  • Left: The navigation bar will be present at the left side of the page. Pages will be displayed as tabs from top to bottom in their sequential order. The Branding Image will appear at the top of the navigation bar. 
    • Selecting Left for Navigation Bar Orientation will also allow setting the Enable Navigation Bar Collapse property. When Enable Navigation Bar Collapse is selected, the navigation bar will display a small arrow icon that can be used to collapse the navigation menu to the left, and only display the Page icons.
    • Selecting Left for Navigation Bar Orientation, and Enable Navigation Bar Collapse will allow configuring the Is Navigation Bar Collapsed by Default? property. This property determines how the navigation bar collapse/expand behavior will change when navigating to another page.
      • Selecting Default for the Is Navigation Bar Collapsed by Default? property will keep the user’s choice. If the user collapses the navigation bar, it will remain collapsed, and vice versa.
      • Selecting Default Expanded will expand the navigation bar when the user navigates to another page, even if the user collapsed the navigation bar prior to the navigate action.
      • Selecting Default Collapsed will collapse the navigation bar when the user navigates to another page, even if the user expanded the navigation bar prior to the navigate action.

Note that not including a navigation bar will preclude the use of a Branding Image on a given page.

This property is applicable to following page type(s):

  • Standard

Allow Exit on Validation Errors

The Allow Exit on Validation Errors property of a page will determine whether or not the user can navigate away from a given page even though the validation criteria that is configured for controls on that page has not been satisfied.

For example, if your page has a required field that has not been entered and this value remains unchecked, the user will not be able to leave the page until they have entered a value into the control. Alternatively, if this value is enabled, the user will be able to navigate to a different page, irrespective of whether or not they have entered a value into the control.

This property is applicable to following page type(s):

  • Standard

External Link Type

This property determines where the target external URL is to be selected from.

Selecting Static will allow entering a static URL, whereas the By Value Of option will use the URL generated by the named range selected from the External Named Range field.

This property is applicable to following page type(s):

  • Link

External Link Static Value

If the Static External Link Type is selected, you can enter the target URL into this field.

Please note that the URL entered here must include "http://" or "https://" in front of it.

This property is applicable to following page type(s):

  • Link

External Link Named Range

If By Value Of External Link Type is selected, you can select a named range from which the target URL will be pulled.

Please note that the URL entered here must include "http://" or "https://" in front of it.

This property is applicable to following page type(s):

  • Link

Open in New Page

The Open in New Page property determines whether the target URL is going to be opened on a new page, or load in the current page.

This property is applicable to following page type(s):

  • Link

Visibility Toggle

The Visibility Toggle property of a page determines whether there are any rules controlling the visibility of the page.

This property is only available when there is a Boolean Named Range (BNR) defined in your workbook (i.e. a named range pointing to a single cell that evaluates to either TRUE or FALSE).

Enabling the Visibility Toggle property will expose an additional field, visible by value of. A list of all BNRs from your workbook will be available for selection. This input is required for the Visibility Toggle functionality to be work. Leaving this field unselected will result in the Visibility Toggle being deselected upon save.

In scenarios where the target BNR evaluates to FALSE during calculations in your workbook, the target page will not be visible for selection in the navigation bar. Note that this does not preclude navigation to the target page: users can still be navigated to this page via button redirection and can still start on this page if it is selected as the Home Page. This feature simply hides the navigation entry from the navigation bar.

In order to prevent navigation to a given page (either through button redirection or the navigation bar), the page must be set as Disabled via the Enabled Toggle functionality described below. These two features can be used concurrently in order to both hide the page from the navigation bar and prevent any redirection to the page.

This property is applicable to following page type(s):

  • Standard
  • Link

Enabled Toggle

The Enabled Toggle property of a page determines whether there are any rules controlling the enabled-ness of the page.

This property is only available when there is a Boolean Named Range (BNR) defined in your workbook (i.e. a named range pointing to a single cell that evaluates to either TRUE or FALSE).

Enabling the Enabled Toggle property will expose an additional field, enabled by value of. A list of all BNRs from your workbook will be available for selection. This input is required for the Enabled Toggle functionality to be work. Leaving this field unselected will result in the Enabled Toggle being deselected upon save.

In scenarios where the target BNR evaluates to FALSE during calculations in your workbook, the target page will be disabled (but still visible) in the navigation bar. Note that this prevents navigation to the target page, both through the navigation bar and button redirection. As a result, an additional input is available when this property is toggled: If Disabled, Go To Page.

The If Disabled, Go To Page property determines where the user will be redirected if a button redirects to this page but the page is disabled. This can help facilitate certain workflows, although it is not required. If left null and an action would redirect to the given disabled page, then the redirect action is simply cancelled and the user will remain wherever they are.

This property is applicable to following page type(s):

  • Standard
  • Link

John has a survey application where he captures information about pet ownership. He captures specific information regarding pets of various types.

On the home page of his application, he captures whether or not the family has any pet birds via named range HasBirds. He has a Next button that is set to redirect to the Birds page of his application.

If the family does not have any pet birds, then he would like to skip the Birds page of his application and go straight on to the Dogs page.

John enables the Enabled Toggle of the Birds page and sets the enabled by value of property to target the HasBirds boolean named range. He then sets the If Disabled, Go To Page property of the Birds page to point to the Dogs page.

Now, when John enters that the family does not have any pet birds and clicks the Next button on the home page of his application, he is redirected to the Dogs page, since the Birds page is disabled.

In the example above, John could also perform a series of redirections using the If Disabled, Go To Page property by configuring the enabled-ness of the Dogs page using a HasDogs named range (e.g. redirecting forward to a Cats page) and so on. However, if there is a circular loop implicit within your rules for the If Disabled, Go To Page property, then you will receive a message that designates this upon save. At the end of such a chain, there must always be an endpoint that is enabled non-conditionally.

A disabled page will still show up in the navigation bar of your application (when the navigation bar is visible) but will not be click-able. To also hide the page from the navigation bar, utilize the Enabled Toggle in conjunction with the Visibility Toggle.