If, for example, you need to hide a component until a row is selected in a table, you need to do the following:
- Select the component that you want to add conditional visibility to. In this example, that component is a table that displays all the purchases made by the selected customer.
- In the component menu, go to the Display section.
- Click in the Conditional Visibility field, and choose the condition that you want to use, or use a formula. In this example, I'm choosing my Customers table and then Selected Row. This way, when my user clicks on a customer, a table will appear below the first one that shows all the purchases made by that customer. Note that I click on the Apply button next to Selected Row – this is because I don't want a specific value from that row.
You do not have to enter it manually, but the value of the Conditional Visibility field in this case will be
=elements.Customers["0"].selected_item
{% hint style="info" %} The table will now be hidden as long as no row is selected in the table. {% endhint %}
App Builder view:
App view:
