top of page
Block Off Time for Staff Members

Block Off Time for Staff Members

Block off chunks of time in bookings staff calendars.

Intermediate.png

Advanced

2K

Published:

September 12, 2021

Girl Enjoying her Drink

by

Anchor 1
Hire a Developer

Example Description

In this example, you can select one or more Wix Bookings staff members and block off a chunk of time on a specified day from their calendar.

 

 

Security Note

 

The code in this example exposes sensitive business information. Make sure to use this example on a dashboard page so that only authorized admins can access the data.

Example Code

Tab 1

.

Tab 2

.

Tab 3

.

This code solution can be complicated.

How We Built It


Page Elements


We added the following page elements to our site:


  • 2 multi-checkboxes, one for selecting all staff members and the other for selecting each individual staff member

  • 1 date picker for selecting the relevant date

  • 2 time pickers for selecting start and end time

  • 1 button to trigger the blocking time process

  • 1 text element for displaying messages

  • Repeaters for displaying available service slots for each staff member



Code


  1. Initialize the filters and set default values.

  2. Use the backend getStaffList() function to return the staff member data and initialize the multi-checkbox options.

  3. Create an onClick() event for the button that does the following: create startDate and endDate date objects based on the selected date and times, and use the backend blockSessions() function to start the process of blocking time based on the selected staff members.

  4. Use the text element to display success or error messages.

  5. Display the adjusted list of available service slots in the staff slot repeaters. Note that the blocked time will also appear in the staff members’ calendars.

APIs We Used

Non-code example.

Non-code example.

Non-code example.

Related Articles

Article Link

Hire a Developer

Velo solutions are powerful tools, but building them on your own can be challenging. Let an experienced Velo development shop build it for you, so you can keep working on your site or business.

Related Examples

Did this help?

Yes

|

No

Thanks for your feedback!

Bookings Payroll Calculator

Bookings Payroll Calculator

Calculate and display bookings and earnings for each staff member.

Intermediate.png

Advanced

Send SMS on Booking Confirmation

Send SMS on Booking Confirmation

Send a confirmation SMS when customers book a service.

Intermediate.png

Advanced

Anchor 2
bottom of page