# Hiding a component until a row is selected
If, for example, you need to hide a component until a row is selected in a table, you need to do the following:
1. 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.
2. In the component menu, go to the *Display* section.
3. 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:
