Show/hide widgets based on previous answers (Conditional Value)

Conditional Values

Conditional Values determine whether the element containing the conditional statement will be visible. If the expression in the conditional value is evaluated to true at runtime, the element will appear on the form. These conditional values are used to create simple or complex skip logic. (For example, if ‘No’, skip to question 10.) This should not be confused with iFormBuilders "disable" feature. Using the disable feature will prevent the element from being visible on the device regardless of conditional value.

In the example below if the user selects "Other" from the pick-list then a text area will appear below it on the device. When a user selects any other value besides "Other" the element will never appear on the device.  This is controlled by the Conditional Value in the Text-Area element.

Data Column Name:  reason

Options: "Value", "Speed to Market", "Friendly Staff", "Other" 
Option Index Value
Speed to Market==1
Friendly Staff==2

Conditional Value 

Like Dynamic Value, Conditional Value should be legal JavaScript express. At runtime, the values of all elements are represented by JavaScript variable determined by the name of the element. 

For any question you wish to add a conditional, you will be referencing the “data_column_name” of that element. 

Remember, data column names must be database friendly: 

1) Preferably all lower case 
2) Cannot start with a number 
3) Contain_no_spaces 

Option lists use index values and always start with 0. The two lists below show that each option can be related to an index value.

Yes = 0 
No =1 
Maybe =2 

These are examples of acceptable conditionals

data_column_name == 1 

data_column_name != 1 

data_column_name >= 1 

data_column_name <= 1 

data_column_name > 1 

data_column_name < 1 

To assign multiple conditionals to one element use the following

&& = and 

|| = or 

Hide an Element From View on the Device

Place the following in the Conditional Value:




Single Conditions (Examples) 


[data_column_name] == [pick list number] 

[data_column_name] >= [pick list number] 


[data_column_name] <= [pick list number] 

[data_column_name] < [pick list number] 

[data_column_name] !> [pick list number] 

Multiple Conditions (Examples)

[data_column_name1] == [pick list value] && [data_column_name2] == [pick list value] - This statement will evaluate both conditions together and only show the element if both are true.
driver_name==1 && driver_skill==5

[data_column_name1] == [pick list value] II [data_column_name2] == [pick list value] - This statement will evaluate both conditions separately and show the element if either are true.

driver_name==1 || driver_skill==5

Multi-Select Conditionals

We use bitwise operation for multi-select elements so a multi-select creates a binary number. Lets say you have four options ABCD. If all are off (unselected) it would be 0000. If A,C is selected it would be 1010, If only D is selected it would be 0001 and so on...

To have an element show if a particular choice is selected you would use the following conditional:
((data_column_name & parseInt("00001", 2)) == parseInt("00001", 2 )) 

This is saying show this element if the 5th choice in a multi-select is chosen. 

If you want to have an “Other” choice as the last option in a multi-select or want to put a conditional on the last option the conditional logic would be
((data_column_name & 1) == 1) 

***This says we only care if the last bit is on, and not care about any other bits. For more information about bitwise operation, look 
***NOTE: When using Multi-Select Conditionals make sure you do not have more then 31 options in your list or this function will not work.
You can also use multiple conditions for multi-select elements.

*Multi-Select Conditional Example*


Using Multi-Select Conditionals


Text and Number Conditionals


Conditional Logic can be applied to a Text and a Number Elements. Using Conditional value in a text element is very similar to that of a Pick List. The main difference is you are using a String of Text enclosed in "Quotes" instead of the Index of the option in the Option List. 

Lets say we have the following scenario. There are two Elements, a Text Element and a Label Element. If the user types in "joe" in the text element the label will appear and show the text to the user on the form. If the user enters any other name besides "joe" the label will not appear. 


Data Column Name:  name

Conditional Value 


Using conditional logic with a Number Element is done the same way as using a Pick List.

In this example we have two elements, a number and a text. If the number entered in the number element is greater than or equal to 33 then the temperature is to high and the text element will appear prompting the user to enter a reason for their temperature being to high.

Data Column Name:  temperature
Label: Reason for High Temperature
Conditional Value 
    Was this article helpful?
    3 out of 3 found this helpful
    Have more questions? Submit a request


  • Avatar

    Explicit enough for anybody to understand

  • Avatar
    Eric Ertl

    Does anyone know if its possible to use a conditional value with iformbuilder built-in functions? For instance, if I wanted only Joe Smith to see a signature widget can I write something like iformbuilder.username=="joesmith" in the conditional value?

  • Avatar
    Tony Ruth

    Hi Eric, you shouldn't have any problem doing so. Any valid JS logic can be used to show / hide fields.

  • Avatar
    Jonathan Mukesha

    This is my eg. of the previos validation condition,
    (element1 == 0) || (element2 <= 300 && element2 >= 0)
    (element3 == 0) || (element4 <= 300 && element4 >= 0) && (element4 <= element0)

    Previously all these elements was type : number, and i'have changed them to "Select" for making the data collection quick, so they will have to select with a range preset. eg 10 20 30 40 50
    now my data validation can't work anymore because now the type of data is select and no longer number.
    How does an elementX can be created to do the sum of element1, element 2 and element3? if they type select and not number?

Powered by Zendesk