Flexcard states, conditions and conditional rendering
When to use Flexcard states versus element conditions, how state order and the Blank Card State decide what shows, why records disappear when no state matches, and how condition groups, Flex.index, show/hide toggles and Preload Conditional Component shape what renders.
Advise on utilizing conditional rendering and state variables to dynamically adjust card appearance or content based on the underlying data or user interaction.
~7 min read · 10 practice questions ·
What the exam expects
- Recommend states when the layout or many elements change with the data, and element conditions for a single element, field or action.
- Order states so the right one wins, and use a Blank Card State for "no data" on the Managed Package Runtime.
- Explain why repeated records vanish when no state's condition matches them.
- Specify conditions correctly: empty-value checks, literal values only, and condition groups joined by AND or OR.
- Recommend Flex.index conditions, Set Values show/hide toggles and turning off Preload Conditional Component for performance.
Key terms: state (a card-level layout with its own elements, styling, actions and condition), element condition (a rule that shows one element, field or action), condition group (conditions wrapped like parentheses), Blank Card State (the state shown when the data source returns no records), Preload Conditional Component (renders hidden elements' HTML in advance).
Key facts
- Detail
- The first state, top to bottom, whose conditions are true
- Detail
- Complex conditions, simple, no conditions, Blank Card State (Managed Package Runtime page)
- Detail
- Displays when no data is returned (Managed Package Runtime page)
- Detail
- Records are hidden
- Detail
- States load faster than many conditional elements in one state
- Detail
- Enter undefined as the value
- Detail
- Not allowed, except Parent.attr for a child card's state element
- Detail
- Element shows on the first three cards
- Detail
- On by default; deselect for performance; Blocks need it turned off explicitly
Sources for this section (7)
- Add States and Conditionstrailhead.salesforce.com (opens in a new tab)
- Add Conditions to a Flexcard Statehelp.salesforce.com (opens in a new tab)
- Flexcard Stateshelp.salesforce.com (opens in a new tab)
- Configure Flexcard Settingshelp.salesforce.com (opens in a new tab)
- Test and Activate Flexcardstrailhead.salesforce.com (opens in a new tab)
- Set Up Conditions to a Flexcard Elementhelp.salesforce.com (opens in a new tab)
- Set Up Card Actions to Update a Flexcardhelp.salesforce.com (opens in a new tab)
- Why should a state with no conditions sit below conditional states?
- When is a condition on a Menu action better than a new state on a Standard Runtime card?
- How do you test for an empty field in a Flexcard condition?
- When does a Standard Runtime card with Preload Conditional Component on still slow the page?
- What does a Flex.index < 2 condition display?
The questions are free to read. Answers with their sources and self-grading are included with the pack.
Keep reading with the Omnistudio Consultant pack
- Core concepts
- Exam traps
- Worked scenario
The pack includes:
- All 31 lessons of the Omnistudio Consultant guide, with reading progress
- Interactive decision walks and step-by-step sequence steppers
- Inline practice questions and one-click topic practice (10 questions for this lesson)
- An official source cited for every claim
- An AI tutor that answers from the guide
- Unlimited timed practice exams