---
title: "Action Element condition as Display rules"
slug: "action-element-condition-as-display-rules"
updated: 2025-03-13T04:32:47Z
published: 2025-03-13T04:32:47Z
---

> ## Documentation Index
> Fetch the complete documentation index at: https://support.whatfix.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Action Element conditions as Display Rules

* [Introduction](#introselected)
* [Types of Action Element condition rules](#typesselected)
* [Use Cases](#usecaseselected)


## <a name="introselected"></a>Introduction

To ensure that performing an action on a particular element triggers the branched Flow, use the **Action Element Is** or **Action Element Text** as a Display Rule. This enables you to add identifiers or properties to ensure that the branched Flow starts on the correct element.

The following are the Action Element rules:

[Action Element Is (Select Element/CSS Selector/jQuery Selector)](#actionelementis)
[Action Element Text (Select Element/Is, Is One Of)](#actionelementtext)

:::(Warning) (Note:)
The Action Element rules are available only under Display Rules for Branching in a Flow.
For more information, see [Branching in Flows](/studio/docs/branching-in-a-flow){target="_blank"}.
:::

## <a name="typesselected"></a> Types of Action Element condition rules

### <a name="actionelementis"></a> Action Element Is (Select Element, CSS Selector, or jQuery Selector)

* Whatfix enables you to select an element as a Display Rule by using the **Select Element** option from the dropdown. Clicking this element triggers the branched Flow.  
![Studio_Flow_Branching_Rule.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Flow_Branching_Rule.png){height="" width="500"}

* Web applications use unique IDs for some elements on the page. Add the unique ID as a **CSS Selector or jQuery Selector** for the element. This is used when your element needs to be selected from a list of options. For example, a dropdown menu. 
![Studio_Branching_Selectors.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Branching_Selectors.png){height="" width="500"}

The following are examples of jQuery selectors:

* $("#firstname"): Selects the element with id="firstname"
* $(".primary"): Selects the element with class="primary"

The following are examples of CSS selectors:
* input[title="Search"]: Selects the input element with the title "Search"
* [id="#analytics-left-pane"]: Selects the element with the id="analytics-left-pane"

### <a name="actionelementtext"></a> Action Element Text (Is or Is One Of)

This is the text that is displayed on the Action Element that is selected. If your application supports multiple languages, choose the **Is One Of** option and add the name with a comma(,) as a delimiter.
![clm_branching DR_action element is](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/clm_branching%20DR_action%20element%20is.png){height="" width="500"}

:::(Info) (Info:)
The value is case-sensitive.
:::

## <a name="usecaseselected"></a> Use Cases

<div class="accordion">
    <div class="accordion-toggle"> Trigger a branched Flow on options inside a dropdown</div>
    <div class="accordion-content">
     <p>  
         
Consider that you want to trigger a branched Flow on one of the options inside a dropdown. These options have unique identifiers (IDs) as CSS Selectors.
         
1. On the Whatfix Studio, select the rule as **Action Element Is** and **CSS Selector**.
![Studio_Action_element_Is.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Action_element_Is.png){height="" width="500"}
         
2. Enter the selector.
![Studio_Flow_Action_element_Is_Selector.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Flow_Action_element_Is_Selector.png){height="" width="500"}

         
3. Finish creating the Whatfix Flow.
         
</div>
</div>

<div class="accordion">
    <div class="accordion-toggle"> Trigger a branched Flow when there are no unique identifiers for the elements</div>
    <div class="accordion-content">
     <p>  
         
Consider that you want to trigger a branched Flow on buttons that don't have unique identifiers other than button names. In such a scenario use the Action Element Text to ensure that the branched Flow triggers correctly.
         
1. On the Whatfix Studio, select the rule as **Action Element Text** and **Is**.
![Studio_Action_element_Text_is.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Action_element_Text_is.png){height="" width="500"}

2. Enter the button name.
![Studio_Action_element_text.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Action_element_text.png){height="" width="500"}
         
3. Finish creating the Whatfix Flow.
         
    </div>
    </div>

## Related

- [Branching in a Flow](/branching-in-a-flow.md)