Damn. Using buttons to filter a list is harder than anticipated!

Hey, so a slightly nuanced question here:

I have made a list of learning resources for the users.

I have added multiple filters so they can filter the learning resources based on its level (beginner, intermediate, advanced), reading time, and category.

I want the user to be able to filter the level of the resources using buttons or toggles.

Kinda like this:
Screenshot 2023-05-29 10.34.21

I have had to use toggles because I couldn’t work out how to make the button stay highlighted when clicked, and I couldn’t add an action for when it is unselected.

It looks like this:
Screenshot 2023-05-29 10.35.30

And it kinda works, except the user’s input which is stored in a database field doesn’t refresh when the page is reloaded (I haven’t yet been able to work out how to do that), so the values they entered last time stays when they re-open the page.

Is there a way I can do this with buttons instead, like what I’ve shown above.

In fact, I’m aware that how I’ve done it probably isn’t the best way, so how would you go about doing this (just got adalo last week so still a newbie!)?

Also, is there a way I can clear a database field’s value every time a page is refreshed?

Thanks a lot! :sweat_smile:

To answer your last question first: You can set actions on page load and have them change the values in your collection.

That said the latency of writing and reading to the database does make it a little jangly. I would suggest you instead create pseudo local values by:

  1. Creating a separate page called “Values”
  2. Add a text input field called “toggle”

On the page you want to do the filtering:

  1. Add the “not-toggled” buttons as you have them
  2. Add “toggled” buttons below the ones you have that are the toggled colours
  3. Instead of updating the database, have your buttons update the “toggle” field on your “values” page.
  4. Drive the “toggled” and “not toggled” buttons visibility based on the value in the “toggle” field. e.g. Show thisButton if toggled=Beginner, Show thisOtherButton if toggled<>Beginner etc
  5. Drive the filtering also based on the value in the “toggle” field
  6. Add an action on page load to reset the value of the “toggle” field on your other screen

That may seem complicated but it does work pretty well