Conditional element loading in No-Code - Step-by-Step Execution

Concept Flow - Conditional element loading

Start

↓

Check Condition

↓

Load Element

↓

End

The process starts by checking a condition. If true, the element loads; if false, it does not load.

Execution Sample

No-Code

If user is logged in:
  Show welcome message
Else:
  Show login button

This example shows how an element (welcome message or login button) loads based on user login status.

Analysis Table

Step	Condition Checked	Condition Result	Action Taken	Element Loaded
1	Is user logged in?	Yes	Load welcome message	Welcome message
2	Is user logged in?	No	Load login button	Login button
3	No more conditions	-	Stop checking	No new element

💡 Execution stops after condition is checked and element is loaded or not loaded accordingly.

State Tracker

Variable	Start	After Step 1	After Step 2	Final
user_logged_in	Unknown	True	False	Depends on user state
element_loaded	None	Welcome message	Login button	Welcome message or Login button

Key Insights - 2 Insights

Why does the element sometimes not appear at all?

If the condition is false (without an else branch), the element is not loaded, so nothing shows.

Can more than one element load at the same time?

No, because the condition chooses only one path (see execution_table steps 1 and 2), so only one element loads.

Visual Quiz - 3 Questions

Look at the execution_table at step 1. What element is loaded when the condition is true?

A No element

B Login button

C Welcome message

D Error message

💡 Hint

Check the 'Element Loaded' column in execution_table row for step 1.

At which step does the condition become false and a different element load?

A Step 1

B Step 2

C Step 3

D Never

💡 Hint

Look at the 'Condition Result' column in execution_table to find when condition is 'No'.

If the user_logged_in variable changes from false to true, what changes in the variable_tracker?

A element_loaded changes from Login button to Welcome message

B element_loaded stays as Login button

C user_logged_in stays false

D No change in variables

💡 Hint

Check variable_tracker rows for user_logged_in and element_loaded values.

Concept Snapshot

Conditional element loading:
- Check a condition (e.g., user logged in)
- If true, load one element
- If false, load another or none
- Only one element loads per condition check
- Used to show/hide parts of a page dynamically

Full Transcript

Conditional element loading means showing or hiding parts of a page based on a condition. The process starts by checking if a condition is true or false. If true, one element loads; if false, a different element or no element loads. For example, if a user is logged in, a welcome message appears; if not, a login button appears. Only one element loads at a time depending on the condition. This helps make pages dynamic and personalized.