Bubble.io Date filter: Today

Introduction to Date Filtering in Bubble

I just got off a call with a Bubble Coaching client and we spent a lot of that cool 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 are learning Bubble if you're launching a no code SAS startup then click the link down in the description because we've got many more videos just like this one.

Setting Up the Calendar and Search Function

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 to date's date.

Creating the Date Filter Expression

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.

Understanding the Current Date Time Function

So if it's happening today then I need to say current date time and I need to say rounded down to day. Let's go into the preview see what that returns. So today is May 8th and so we can say this returns May 8th midnight so yeah it's rounded down to today. Quick words this is going to be relative to your users time zone so do be aware that you're not going to return exactly the same moment in time if you rounded down to users dates but they're in different time zones.

Handling Future Events

Now I need to do something else which is my calendar could have events in the future so I could say rounded down 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.

Finalizing the Date Filter Expression

So if I go into 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 this 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.

Applying the Filter to the Calendar

Okay so that's how we can apply that filter to our calendar here now there are two different ways that you can apply this conditionally based on the bus and 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 plan to 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.