Contact us Pricing info
hr

WooCommerce Bookings – Weekend check-out to check-out on Sunday

Miki2 minutes read

How to Automatically Shift WooCommerce Bookings Checkout to Sunday

In this article, we’ll show you how to detect when a user selects Friday, Saturday, or Sunday as the checkout date in WooCommerce Bookings and automatically adjust the end date to the next Sunday. This tweak is especially useful for weekly packages, weekend stays, or any accommodation rented on a weekly basis.

The Problem and the Goal

By default, WooCommerce Bookings lets users choose any date for check-in and check-out. When your product is configured for weekly bookings, any checkout date other than Sunday is invalid. Our goal is to intercept the checkout selection and, if it falls on Friday, Saturday, or Sunday, shift it to the following Sunday.

A Solution Without Fragile Click Counters

Instead of trying to detect calendar clicks or maintain custom click counters, the most reliable approach is to listen for the native change event on the hidden inputs that Bookings uses to store dates.

  1. Listen to both sets of inputs:
    • input.booking_date_day for check-in
    • input.booking_to_date_day for check-out
  2. In the event handler, read the day, month, and year values from the corresponding inputs
  3. Construct a Date object and use getDay() to determine the weekday
  4. If the checkout date is Friday (5), Saturday (6), or Sunday (0), calculate the next Sunday
  5. Update the input values accordingly and notify the user with an alert

JavaScript Implementation

jQuery(function($){
	$('input.booking_date_day, input.booking_to_date_day').on('change', function(e){
		const isCheckout = $(e.target).hasClass('booking_to_date_day');
		const prefix = isCheckout ? 'booking_to_date' : 'booking_date';

		const day	= parseInt($(`input.${prefix}_day`).val(), 10);
		const month = parseInt($(`input.${prefix}_month`).val(), 10);
		const year	= parseInt($(`input.${prefix}_year`).val(), 10);

		if (!day || !month || !year) return;

		const selectedDate = new Date(year, month - 1, day);
		const weekday = selectedDate.getDay(); // 0 = nedjelja, 5 = petak, 6 = subota

		console.log(`Promjena na ${isCheckout ? 'checkout' : 'checkin'} datumu: ${year}-${month}-${day}`);
		console.log('Weekday:', weekday);

		if (isCheckout && (weekday === 5 || weekday === 6)) {
			const nextSunday = new Date(selectedDate);
			if (weekday !== 0) {
				nextSunday.setDate(selectedDate.getDate() + (7 - weekday));
			}

			const newDay = String(nextSunday.getDate()).padStart(2, '0');
			const newMonth = String(nextSunday.getMonth() + 1).padStart(2, '0');
			const newYear = nextSunday.getFullYear();

			$(`input.booking_to_date_day`).val(newDay);
			$(`input.booking_to_date_month`).val(newMonth);
			$(`input.booking_to_date_year`).val(newYear);

			alert('Check-out mora biti u nedjelju. Datum je automatski prilagođen.');
		}
	});
});

Conclusion and Further Possibilities

This approach leverages existing hidden inputs and standard change events, avoiding reliance on fragile click counters or internal plugin events. You can extend it with server-side validation, custom user messages, or automatic date blocking via PHP filters.

If you need a complete plugin package, a frontend debug overlay, or automated Cypress tests, just let me know and we’ll prepare the next steps.

Miki

Not sure what to do next?

Reach out to us and find answers to your questions.

Contact us

Want to Know how we Curly Code?

Take a peek at some of the projects we've worked on.

View our work