Forum Academy Marketplace Showcase Pricing Features

Date/Time Picker

I have an Airbnb style app and I am wondering if there is any way that the date and time picker can show “unavailable dates” when a listing is rented by a guest.

For example, if this listing below had been booked for the dates May 23 & 24th I am wondering if it is possible for the date and time picker to display the given dates as unavailable.

@emmanuel

No, the standard date picker doesn’t work like that.

You have to build your own, which was pretty difficult until the date range functions came along. I think I have an example built, will dig it out.

Ok thank you very much Nigel!

yer sorry mate, i thought you were looking to find a way to show the dates as unavailable, i didn’t realize you meant actually blanking the calendar’s tiles out.

Thanks for the help anyway @jarrad

@NigelG were you able to dig up your example yet?

Thanks everyone!!

1 Like

Yes, found it !

It isn’t very pretty, but it works (I think).

The admin page is here…

There is quite a lot going on. The top part is showing how you can display “free” dates. It is complicated by the fact that you can’t say “show me all the things that DON’T overlap” so I have a Repeating Group of things that DO overlap and then the “Free” Repeating Group filters on that list. So you are creating a list of booked rooms, and then having a list of rooms that are NOT in the that list.

The bottom part shows how you can create something like the date picker you are after. It lists out dates (you need to have a pre populated data type with dates I am afraid) and colours them if there is a booking on that date.

Hopefully the data structure makes sense, your have ROOM and that has a list of BOOKINGS. BOOKING has a Date Range. And you use that date range and OVERLAPS (for from/to) and CONTAINS (for single date) to check the dates.

Have a look and see if it makes sense.

Hi Nigel,

Thanks for your help! when I click on either of those links it takes me to my home page. I’m not really sure what the issue is but would you mind sharing the link again?

Thanks so much!

https://bubble.io/page?type=page&name=roomchoose2&id=trest4