Using the Visibility Function

Megan Jackson

Showing and Hiding Fields (Visibility)

There are so many situations where you may want to show or hide fields (or even whole pages) based on the answer to a question. This is possible in Forms On Fire using the visibility function. Read more below how you can utilize this dynamic feature in the Forms On Fire drag-and-drop online form designer.

For example, say we have a choices field that asks the mobile user, “Do you see any hazards?”, with the options of Yes or No.
If the mobile user chooses Yes, then you may want to show another field that allows them to fill in details about the hazard. However, if the mobile user chooses No, you don’t want to clutter the form with unnecessary fields.

It is very easy to enable this scenario using the Visibility property found in the drag-and-drop online form designer.

Let us assume that your form design currently has a choices field asking the mobile user, “Do you see any hazards?” with the data name of “Hazards”. Let’s also assume that the Hazards choices field has the value options of “Yes” and “No”. Follow the instructions below to learn how to implement visibility functionality into your form design:

Add a new text field (click and drag or just click the icon) to your form design under the Hazards choices field (your Yes or No question).
Give your new text field a data name, such as “HazardsDescription”.
Locate the Visibility property for your new field HazardsDescription (located under the Advanced Properties section in the field properties to the right of the form designer).
Now we need to create a formula that will give a true or false result. When the formula result is true, the new text field will show in the form and when the result is false the new text field will be hidden.

Enter the following formula into the visibility property on your new text field HazardsDescription:

{{Hazards}} = ‘Yes’

What the above formula means is that when the Hazards choices field is answered with a value of Yes, then the app should show the HazardsDescription text field.

To understand more about how to create a formula, see the Creating a Formula article in our Knowledge Base.

Great, now you’re all done!

Save your form design and test it on your mobile device to see the show/hide functionality in action.

If you have any questions feel free to give our wonderful tech support team a call at +1 (425) 214-1920 ext. 2