Changing a Component's Visibility

Search…

With Adalo, you can add logic to your components so that they are only visible when certain rules apply.

Skill Level: Beginner
Before You Begin
Have a basic understanding of Databases, Screens and Components, and Magic Text​
You do not need a paid Adalo plan to use this feature
Walkthrough
With Adalo, you can add logic to your components so that they are only visible when certain rules apply.  For example, you may only want Admin users to see a button that lets them add new records.  Or, you may only want some text to be visible if the certain data is not blank.
To Change the Visibility of a Component:
1.Select a component 
2.Click the More Menu icon (the three dots) at the top right of the left panel, and select Change Visibility
3.Select Sometimes Visible
4.Alter the visibility so that the component is only visible under certain conditions. You can learn more about filter and conditions in this guide.
For example, take the vacation app we've been using to demonstrate different functions. Suppose it displays all planned trips, but we want a way to differentiate trips that are occurring soon from those that aren't. Above we have changed the visibility of the hourglass icon so that it's only visible for a particular trip if that trip is happening between the current day and a week from the current day.
If you want to learn how to create an empty state— a screen that shows up when no data input matches filtering or search criteria— check out this tutorial.

Forms

Navigation

Last modified 11mo ago

Copy link

Outline

Before You Begin

Walkthrough