logo
Forms
Nov 27

How to automate time-off requests in SharePoint

Customer Support Engineer

Before the holiday season kicks in, we'd love to share with you how to set up SharePoint time-off request calendar for your employees with an approval process in Power Automate. We'll also use Plumsail Forms to customize time-off request form, making the form more user friendly, hiding the approval field from the user, and adding validation for leave dates ensuring that they are valid and do not conflict with already approved vacations.

 

In this article:

Otherwise, watch the quick video overview of the process:

 

Automate time-off requests in SharePoint

Let's jump into the practical process, starting with setting up a SharePoint time-off request list. Next, we'll turn the list view into a calendar, customize the form with validation, and set up an approval process in Power Automate to approve or delete requests, while notifying employees.

 

Set up a SharePoint time-off request list

First, set up a SharePoint List. You don't need many columns, we'll use basic ones:

  • Title
  • Start Date
  • End Date
  • Employee (Person)
  • Department (Choice)
  • Manager (Person)
  • Approved (Yes/No)

We're also making most of the fields required as we'll need them for the approval process.

SharePoint List columns for time-off request list  

Inside the List, click Add view:

Click add view  

We'll setup a calendar view:

Add Time-off calendar view to SharePoint List  

And we'll click add or remove fields:

Add or remove fields from Time-off calendar view  

To add the Approved column to the freshly created calendar view:

Add the Approved column to the Time-off calendar view  

It will not appear in the view, but we can now use it to add conditional formatting and highlight approved requests with different color:

Setup different color for the approved requests  

Customize time-off request form

Customizing the form with Plumsail Forms for SharePoint is extremely easy. If you want to get started, check out the step by step installation guide in our documentation.

We'll just drag-n-drop fields onto the form:

Drag and drop fields to create custom form with Plumsail Forms  

It will look great and adjust to screens of all sizes. We'll also add List or Library control to make existing requests visible to the user.

Add List or Library control to show existing time-off requests  

Finally, we'll play with some code, and we'll add custom validators for the Start and End dates: first of all, Start Date should be before or equal to End Date. Secondly, we'll add a form validator with pnpjs to check whether there is a conflict - an existing request from the same department that has been approved already, and if so - prevent the form from saving.

fd.spRendered(function() {
    fd.validators.push({
        name: 'Dates conflict validator',
        error: 'These dates are already taken by an employee from the same department',
        validate: function() {
            // check whether there are requests already
            return pnp.sp.web.lists.getByTitle('Time-off requests').items
                    .select('Title', 'Id', 'StartDate', 'EndDate')
                    .filter("Department eq '" + fd.field('Department').value + "' and Approved eq 1")
                    .get()
                    .then((items) => {
                        // see if we got something
                        if (items.length > 0) {
                            for(var i = 0; i < items.length; i++){
                                var item = items[i];
                                var startDate = new Date(item.StartDate);
                                var endDate = new Date(item.EndDate);
                                //check for conflict
                                if ((startDate < fd.field('StartDate').value && endDate < fd.field('StartDate').value) || 
                                   (startDate > fd.field('EndDate').value && endDate > fd.field('EndDate').value)){
                                   continue;
                                }
                                else {
                                    return false
                                }
                            }
                        }
                        return true;
                    });
        }
    });
    
    fd.field('StartDate').addValidator({
        name: 'StartDate validator',
        error: 'StartDate cannot be after End Date',
        validate: function(value) {
            if (fd.field('EndDate').value && value > fd.field('EndDate').value) {
                return false;
            }
            return true;
        }
    });
    
    fd.field('EndDate').addValidator({
        name: 'EndDate validator',
        error: 'EndDate cannot be before Start Date',
        validate: function(value) {
            if (fd.field('StartDate').value && value < fd.field('StartDate').value) {
                return false;
            }
            return true;
        }
    });
});

Now, this code will ensure that the dates are specified properly and there is no conflict with existing approved requests.

Dates are already taken by another employee in the same department  

Automate approvals for time-off request in SharePoint

With our setup, creating an approval flow in Power Automate will require just a few steps.

Set up a Power Automate flow

First of all, we'll create an automated flow which is triggered whenever an item is created in our Time-off requests list:

When item is created  

We'll then use the information on the form to send an approval request to the manager, specified on the form with Start and wait for approval action:

Start and wait for approval  

Adding a Condition block will allow us to check the approval status by comparing Outcome to Approve:

Condition comparing Outcome to Approve  

If the request is approved, we'll update item Approved field to Yes:

Update item in SharePoint on approve  

And we'll send an email to the employee, notifying them that their request was approved.

Send email on request approve  

Now, if the request is not approved, we'll delete the item right away:

Delete item in SharePoint on disapprove  

And we'll also send an email to the employee, asking to contact the manager directly to discuss why the request got disapproved.

Send email on request disapprove  

Test the flow with SharePoint item

We'll test the flow with a simple request:

Test time-off request  

Here's how it looks before approval:

Adele's time-off request before approval  

We'll receive the following approval request to our inbox:

Adele's time-off request on approval  

And if it's approved, that's what we see:

Adele's time-off request after approval  

Resources and final thoughts on time-off requests in SharePoint

Hope that this article was helpful and inspires you to create your own time-off automation in SharePoint. With Plumsail Forms for SharePoint, you can also easily create custom forms, add validation and so much more.

If you'd like to try it out and see if it works for your needs, get started with 30 days free trial of Plumsail Forms for SharePoint Online by following the installation instruction in our documentation, which has a video walkthrough.

If you have any questions, our support team at support@plumsail.com and big community will be happy to help to get started with anything you might need!