We have already introduced you to our application for event bookings. If all places for a date of an event have already been allocated, we have now added the functionality for a waiting list. In this article, we would like to give you more detailed insights into the implementation.

Register for the event waiting list

A user has the possibility to register for an appointment of an event. However, each appointment has a fixed number of participants. If all places have already been booked, we will show a note at the appointment. However, a user then has the option of being put on a waiting list for this appointment. To do this, he simply has to click on the button “Add to waiting list”.

If a user who has booked the appointment logs off, the next user automatically moves in from the waiting list. He is registered for the appointment and will be notified by e-mail.

Furthermore, a user also has the option of deregistering from the waiting list.

Technical implementation

For the waiting list, we have added a new field “Waiting list” of type “Multiple lines of text” in the appointment list. There we save the ID, name and e-mail address of the users for the waiting list in JSON format.

Beispiel:
[{"id":13,"title":"Verena Schönleitner","email":"verena@openinnovationhub.onmicrosoft.com"}]

If a user registers for the waiting list, we add it to the “Waiting list” field.

let waitingList: IAttendee[] = listItem.Warteliste 
    ? JSON.parse(listItem.Warteliste) as IAttendee[] 
    : [];

const updatedListItem = await sp.web.lists.getByTitle(this.eventDateList).items.getById(eventDate.id).update({
    Warteliste: this.serializeWaitingList([...waitingList, attendee]),
});

If a user who has booked the appointment logs off, we read the waiting list. We then remove the first user of the waiting list and add them to the participants. We will inform the user of this by e-mail.

let existingAttendeeIds = listItem.Teilnehmer !== undefined 
    ? listItem.Teilnehmer.filter(t => t.Id !== attendee.id) 
    : [];

const waitingList: IAttendee[] = listItem.Warteliste !== undefined 
    ? JSON.parse(listItem.Warteliste) as IAttendee[] 
    : [];

// Moves the first attendee from wating list up
let waitingListAttendeeElevated = false;
let waitingListAttendee: IAttendee;
if (waitingList && waitingList.length > 0) {
    waitingListAttendee = waitingList.shift();
    existingAttendeeIds = [...existingAttendeeIds, waitingListAttendee.id];
    waitingListAttendeeElevated = true;
}

const updatedListItem = await sp.web.lists.getByTitle(this.eventDateList).items.getById(eventDate.id).update({
    TeilnehmerId: { results: [...existingAttendeeIds] },
    Warteliste: this.serializeWaitingList(waitingList),
});

// Send mail if attendee moves up from waiting list
if (waitingListAttendeeElevated) {
    await this.sendEmailToAttendee(event, updatedEventDate, waitingListAttendee);
}

Have we aroused your interest and would you like more information about our SharePoint event waiting list? Then please get in touch with us.

Contact