Conditional Logic

Modified on Wed, 18 Nov 2020 at 03:54 PM

Conditional logic is used to hide form elements until specific form conditions are met.

For interactive examples of conditional logic and how it can be used, try out this interactive form.


Condition logic can be applied to any element type, and is controlled by a switch in the element details. 

Conditional logic can be applied to User Selection elements (radio buttons, checkboxes, select, and autocomplete) it can also be applied to User Inputs (Text, Text multi-line, number etc).


Selection Elements


I've set up some conditional logic so that some headings will only be shown when certain conditions are met. For example when the radio button 'Radio Button 1' is checked the heading 'I only want to show when Radio Button 1 is checked' will be displayed on the form. 



Now that we have some conditional logic setup lets see what that looks like on the form. Here you can see the 3 elements 'Radio Button', 'Select', and  'Checkbox'. When nothing is checked there are no headings being displayed. However, if the radio button is checked the conditions for the heading to display are met. 



If all the elements are checked, all the conditions are met and all the headings are displayed on the form. 





Input Elements


Conditional logic on user inputs is simple, an input can either have a value or not have a value. 

In the example below the Heading element will remain hidden until the text box above has something typed into it.




This can be used in conjunction with the Summary element to add further context to the Summaries Elements.




Conditional Logic on Numbers and Calculations


Conditional logic can also be placed on number and calculation elements. Meaning you can conditionally show an element based on the value in another element.

The conditions you can place against number and calculation elements include:

  • not equal to
  • greater than
  • greater than or equal to
  • less than
  • less than or equal to
  • between



Multiple Conditional Logic Rules


Okay now that we have an understanding of a single conditional logic rule, lets add one more. When you add a second rule to the conditional logic of an element a new option will appear, the 'Match ALL' and the 'Match ANY' buttons. 


Match ALL - The 'Match ALL' button will ensure that ALL of the rules are met before the element will display.

Match ANY - The 'Match ANY' button will display the element if ANY of the rules are met. 




Now that we have covered that lets' see how it works in practice. Here I have 2 Heading elements '1 or A' and '2 and B'. As you can see from their names, '1 or A' will display if '1'  OR if 'A' is checked, and '2 and B' will only display when '2' AND 'B' are both checked.



ANY 


ALL



If you are still struggling, try reading this document a second time or checking out the interactive form linked at the start of this article. If any confusion remains please contact me via the support portal, create a ticket and I'll help you out as soon as I can.





Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select atleast one of the reasons

Feedback sent

We appreciate your effort and will try to fix the article