Conditional Logic for Fields and Screens

This guide explains how to use conditional logic to dynamically override property and style values based on user answers or other conditions in the quiz editor.

Overview

Conditional values allow you to change property values (for blocks) or style values (for screens and blocks) based on conditions evaluated during quiz execution.

Features

• Conditional Logic: Set property values based on user answers or other conditions
• Multiple Rules: Create multiple override rules with AND/OR logic
• Flexible Operators: Use various comparison operators (equals, contains, exists, etc.)
• Visual Indicators: Properties with conditional logic show a green slider icon
• Block and Screen Support: Apply conditions to both block properties and screen properties

How to Access Conditional Logic

For Block Properties

1. Select a screen from the screens list
2. Select a content block from the content list
3. In the Properties tab, find a property that supports conditional logic
4. Click the slider icon next to the property name
5. The Conditional Logic modal will open

For Screen Properties

1. Select a screen from the screens list
2. In the Screen Properties tab, find a property that supports conditional logic
3. Click the slider icon next to the property name
4. The Conditional Logic modal will open

Conditional Logic Structure

Each conditional override consists of:

• Conditions: Rules that determine when the override applies
• Value: The value to apply when conditions are met

Condition Types

• AND: All conditions must be met (default)
• OR: Any condition must be met

Available Operators

• exists - Property exists
• not_exists - Property doesn't exist
• equals - Property equals value
• not_equals - Property doesn't equal value
• greater_than - Property is greater than value
• greater_than - Property is less than value
• contains - Property contains value
• not_contains - Property doesn't contain value

Creating Conditional Overrides

Step 1: Open Conditional Logic Modal

Click the slider icon next to any property that supports conditional logic.

Step 2: Add Override Rule

Click the "Add Override Rule" button in the modal footer.

Step 3: Define Conditions

In the left column, define the conditions:

1. Select logic type: "All of these (AND)" or "Any of these (OR)"
2. Add conditions by clicking "Add Condition"
3. For each condition:
   1. Enter the user property name (e.g., question-1, user_age)
   2. Select an operator
   3. Enter a value (if required by the operator)

Step 4: Set Override Value

In the right column, enter the value that will be applied when conditions are met. The input type matches the property type (text, textarea, select, etc.).

Step 5: Save

Click "Save and close" to apply the conditional logic. The property will now show a green slider icon indicating it has conditional logic.

Examples

Example 1: Conditional Button Text

Change button text based on user's answer:

Condition: question-1 equals "yes" Value: "Continue to Payment"

When the user answers "yes" to question-1, the button will display "Continue to Payment" instead of the default text.

Example 2: Conditional Title

Change screen title based on multiple conditions:

• Logic: All of these (AND)
  • user_age greater than 18
  • user_country equals "US"
• Value: "Welcome, Adult User!"

Example 3: Conditional Visibility

Hide a block based on a condition:

Condition: question-2 equals "skip" Value: "hide"

When question-2 equals "skip", the block's Visible property will be set to "hide".