Limited Time Offer: Watch All Our Bubble Tutorial Videos for Only $99 per Year!

Bubble.io Date filter: Today

Learn how to efficiently filter a list of items in a Bubble.io database to showcase events happening today with this helpful guide for no-code enthusiasts.

How to do Date Filtering or Date Constraints in Bubble.io

I just got off a call with a Bubble coaching client and we spent a lot of that call talking about how to do date filtering or date constraints in Bubble. And in this video, I'm going to show you how you can filter a list of items in the database to only show events that are happening today. But before I launch into that, if you're learning Bubble, if you're launching a no-code SaaS startup, then click the link down in the description because we've got many more videos just like this one.

Filtering Events Happening Today

So let's just hop into my demo here. I've got a calendar, I'm doing a search for events, and right now this is going to return every single event in the database. And in the preview, I'm just printing today's date. So in order to filter by events that occur today, well, I need to write an expression like this. I'm going to first write the expression in the text here because then it's easier to see what's going on. And then effectively you would just add that same expression in as a constraint on either your repeating group or your calendar. So if it's happening today, then I need to say current date time and I need to say rounded down today.

Testing the Filter

Okay, let's go into the preview, see what that returns. So today is May 8, and so we can see this returns May 8, midnight. So yeah, worked. It's rounded down to today. Now a quick word. This is going to be relative to your user's time zone. So do be aware that you're not going to return exactly the same moment in time if you rounded down two user's dates, but they were in different time zones.

Filtering Events in the Future

Now I need to do something else, which is my calendar could have events in the future, so I could say rounded down to today, and then I could say days plus one. And let's go into our preview. Okay. And now we see the 9th of May, but we see midnight. So actually we've already crossed into the 9th of May, but we can deal with that using the greater than or less than operators. So if I go into the date, we can say is greater than or equal to our first expression, which is current date time rounded down to day. Okay, but we need to sandwich it between. Now, you wouldn't need to do this if you knew you wouldn't have events in the future, but we need to say the same field less than. So this means that it's going to go all the way up to the millisecond before midnight of the next day. So that's perfect for this rounded down today and then days plus one. Okay, so that's how we can apply that filter to our calendar here.

Applying the Filter Conditionally

Now, there are two different ways that you could apply this conditionally based on the button press. Either you could use the ignore empty constraints, which means that you can populate these two date fields elsewhere and you can make them dynamic. But then, if they're empty, they'd show all events. If your plans use a dropdown where you're going to say like today, last week, this week, that sort of thing, I think you're best using a conditional statement.

Latest videos

crossmenu