Showing a field based on the value of another field

Common scenario: you have a select list with a bunch of options, and the last option is ‘Other - please specify’. If a user chooses this, you want to show them a text field so they can do the ‘please specify’ thing. But you don’t want the text field visible all the time, since it gets in the way and confuses things.

Show/hide formulas to the rescue!

Here’s a simple form - a user enters their name, and chooses their favourite food type. If they select other, we want them to tell us what that is.

In the app settings, here’s what our select box looks like - notice the ‘Other’ in the select options, and we’ve prepared by adding a text field below it:

Now we just need to make sure the text field only displays if the select value is ‘Other’. To do this we use the ’ Display via rule/formula?’ setting - in this case we set it to ‘Show’ if the value of ‘Favourite food type’ is equal to ‘Other’ (eg `Favourite food type` = "Other"):

Here it is in action:

Note that the field label (‘Favourite food type’) is wrapped in backticks (`) to escape the spaces and special characters, and the value is a string. It’s also case-sensitive, so be precise!

The same formula could also be written as 'Other' in `Favourite food type` - check for help with formulas.

There are loads of possibilities with this capability. You can use true/false values for fields like toggles, strings for text or selectboxes, or check for user roles. You can also string complex formulas together based on combinations of values and roles.

Some other examples:

Check for user role, or if user is defined in the ‘viewers’ for the app:

user.highestRole = 'owner' or user.highestRole = 'author'  or (user._id in viewers) 

Check if the row is locked:

isLocked = true 

(or can simplify to just isLocked)

Here’s a complicated example that chains a whole lot of conditions:

isLocked = false and $boolean(`Permission`) and $boolean(`Signature`) and (`Permission` = "Yes" ?  $boolean(`Emergency contact`) and (`Payment required` = "Yes" ? $boolean(`Payment options`) : true) : true)

What does this do?

  • checks the row is not locked; and
  • ‘Permission’ has a value/exists; and
  • ‘Signature’ has a value/exists; and if
  • ‘Permission’ equals ‘Yes’; then
    • ‘Emergency contact’ must have a value; and if
    • ‘Payment required’ equals ‘Yes’: then
      • ‘Payment options’ must have a value