Show If Rule Examples

   MaestroThe UI design product.  |   Form Builder |  All versions This feature is related to all versions.

This example demonstrates a Show if to show a Mobile Number (AUS) component only when the answer to the radio button question is Yes. If a form user selects Yes, indicating that they have a mobile number, then a mandatory text field is displayed so the user can enter a mobile phone number.

To create the Show If rule, follow these steps:

1. Open a Maestro form.
2. Drag a radio button group component to a form.
3. Drag a Mobile Number component to a form.



4. Select the component to show only when the Yes option is selected.
5. Click Create Rule.
6. Select Show if.



7. Type a JavaScript that implements the rule similar to the code shown above. If "Yes" is selected in the radio button group, the script will return true and the mobile number component will show in the form, otherwise the script returns false and the mobile number component is not shown on the form.
8. Click Save.
9. Click Build and Render Form to see how this rule is displayed when the form is built and rendered.



10. If Yes is selected, the Mobile Number component is shown.