Move forward or backward the date with an icon

Is there any way to have a dial with the date and two icons on each side that make the date scroll forward or backward?

For example, today is “05/18” and I click on the “<” icon and go to “05/17”


Save the date as a Custom State. The Dial with the Date will be the custom state’s date.

To go down a day: Custom States’s date +Days(-1)
To go up a day: Custom States’s date +Days(1)

You can set the default date of the Custom State on page load or add conditionals on the buttons to automatically detect if the custom state is empty. If empty, do the calculation based on the current/date time instead.

Hello Thekeybeats2!

Thank you for your help!

I’m new to Bubble and I still have some difficulties, sorry. How do I save the date as “Custom State”? I was using the “Date Picker” to display the date but I can’t add workflow. Do I have to define a condition? Or do I use another element?

Thanks again!

Double Click anywhere on your page. Top right there will be an information Icon. Click on that and add new custom state:

In your workflows tab, you can find different workflow triggers. Add a “When page is loaded” trigger. In that workflow, add an action that will set the date of the custom state you created.

Screen Shot 2023-08-21 at 6.59.17 PM

Then add 2 buttons that will set the state to a different date. One button will increase the date by 1, and the other will decrease it by 1.
The one to increase it by 1 will look like this:

The one to decrease it will be -1 instead.