Hello community! Hope everyone's well!
I have a question: I'm trying to build a booking system but I don't want to use the Wix Bookings API, I want the system to be completely custom built this time.
So, I set it up like this: We have fixed time slots, 10:00 - 18:00, and I made these into buttons. Like so:
onReady the timeSlots are collapsed and hidden. What I want is for the user to first select a date and then the timeSlots will collapse/expand based on the results from the "Bookings" collection. So I want to query the "bookings"-collection for time slots that are already booked for a specific date. And then, if the time slot is booked for a specific date, the buttons will collapse and hide so the user can't select that time again. Am I making any sense?
I tried this code but sadly nothing happens when a date is selected (I made sure there is an onChange event on the datePicker). And I also get an error that ".then is not a function.".
function hideOrShowTimeSlots () {
wixData.query("Bokningar")
.eq("datum", $w('#datePicker1').value)
.eq("tid", "10:00")
.then ((results) => {
let timeSlot = "10:00";
if (wixData.query.results === timeSlot) {
$w('#btn1000').hide();
} else {
$w('#btn1000').show();
}
});
I've tried some variations and did some looking on the forums to find similar problems but with no luck I'm afraid.
Furthermore, I need to somehow make sure that the time that it finds in the "time"-field only checks times for the specific date that is selected from the date picker. As I understand it my current code looks for dates in the dates-field and then for times in the time-field without any restriction meaning it can find times from other dates to.
I'm left a little puzzled by this and not sure how to move forward. Any ideas for how to achieve what I'm trying to do or alternative ways to achieve the same results (without using Wix Bookings API)?
I appreciate all your help! =)
Many thanks in advance!
Regards,
Joe