Making Buttons change Variables

Button components can be used to quickly update variables.

This is specifically done through the Set Variables property under the Interactivity section. See below methods for setting variables using this property:

1. Variable Setting - Basic

The method for setting a variable within this property simply follows the below formula: [variable name]=[value]

A working example would be as follows: timevar=2022

2. Variable Setting - Multiple Variables

To set multiple variables with the same button, follow the above formula and concatenate with "&". The formula would be as below, and as many variables as desired can be concatenated in this way: [variable name]=[value]&[variable name 2]=[value2]

A working example would be as follows: timevar=2022&scenvar=Budget

3. Variable Setting - Dynamic

The variable can also be set dynamically through the button rather than strictly through static values. By clicking the pi icon on the property, the property editor opens. ELEMENT() values, VARIABLE() values and more are able to be parsed in through this editor.

The formula changes a bit in the regard that sections must be surrounded by double quotes and concatenated with the & symbol when joining on aforementioned dynamic portions (such as ELEMENT() and VARIABLE()). Setting the context of a single dimension would follow the below structure (using ELEMENT() as an example): "[variable name]="&ELEMENT("Element Name")

A working example would be as follows: "timevar="&ELEMENT("Time")

4. Variable Setting - Dynamic Multiple Variables

Multiple variables can be set dynamically using a similar concatenation structure shown in the "Multiple Variables" section, adjusted slightly to fit the formatting required in the property editor shown in the "Dynamic" section.

The concatenation requires the "&" symbol, however this needs to be wrapped in double quotes alongside the ampersands outside of quotes that concatenate your dynamic values into the formula. As many variables as desired can be concatenated onto the formula following this structure (using ELEMENT() as an example):

"[variable name]="&ELEMENT("variable name")&"&[variable name 2]="&ELEMENT("variable name 2")

A working example would be as follows: "timevar="&ELEMENT("Time")&"&scenvar="&ELEMENT("Scenario")

5. Toggling Variables

Just as you can set a variable, you can switch it between two values with an IF statement, so one button flips the value each time it's clicked:

IF(
    VARIABLE("scenvar") = "Budget"
    ,
    "scenvar=Actual"
    ,
    "scenvar=Budget"
)

Applied to a Button's Set Variables property, this reads the variable's current value and writes back the other one - so the same button moves the card between Budget and Actual.

Showing and hiding with a variable

A button that sets a variable, paired with a container whose Visible property reads that variable, is how a card shows and hides detail on demand.

The Button's Set Variables property writes the variable; the Container's Visible property is formula-driven from it. Nothing connects the two components directly - the variable is the link, which means one button can drive several containers at once.

Self-resetting patterns

A variable that stays set is a problem for anything that should happen once. A save button that sets save = yes will keep firing on every subsequent refresh unless something sets it back.

The sequence is: the user clicks save, the variable is set to yes, the card refreshes, a Trigger sees save = yes and writes to the cube, then a Variable component with Persist set to yes runs immediately after and sets it back to no. Later refreshes see save = no and don't re-fire the trigger.

The Variable component's Persist property is what makes this work - it's the key to building self-resetting interactive patterns.