How To Create A Simple Approval App Using PowerApps And Flow In SharePoint Online

Introduction

In this article, you will see how to create a simple approval app using PowerApps and Flow in SharePoint Online. To get started refresh your knowledge of PowerApps and Flow. I have created a custom list in SharePoint Online named Change Request which contains the following columns.

SharePoint

We will learn how to create an app using PowerApps Studio and a simple approval process using Flow. The status column will be updated as Approved or Rejected after the completion of approval process.

SharePoint

Create an app for SharePoint Online List using PowerApps

In this section, you will see how to create an app for your SharePoint Online list using PowerApps.

  1. Navigate to custom list (Change Request) in SharePoint Online site. For example,

    https://c986.sharepoint.com/sites/Vijai/Lists/Change%20Request/AllItems.aspx

  2. Click PowerApps and then click "Create an app". 

    SharePoint
  1. Enter app name and then click "Create".

    SharePoint
  1. Building and saving your app.

    SharePoint
  1. By default, generated app contains Browse, Detail, and Edit screen.

    SharePoint
  1. Navigate to the Edit screen, select Status card and then select Visible property in the property box. Set visible property value to false in the formula bar so that Status field will not be shown to users in edit/new form.

    SharePoint
  1. Save and publish the app.

Create an approval process using Flow

In this section you will see how to create an approval process using Flow.

  1. Navigate to custom list (Change Request) in SharePoint Online site. For example,

    https://c986.sharepoint.com/sites/Vijai/Lists/Change%20Request/AllItems.aspx

  2. Click Flow and then click Create a flow. 

    SharePoint
  1. Click See more templates.

    SharePoint
  1. Click Create a flow from blank.

    SharePoint
  1. Search for SharePoint and select SharePoint – When an item is created.

    SharePoint
  1. Make sure you are connected to your SharePoint online site or add a new connection.

    SharePoint
  1. Enter the URL and select the list name from drop down. Click New Step.

    SharePoint

  1. Click New Step and then click Add an action.

    SharePoint
  1. Search for Send Approval and then select Office 365 Outlook – Send approval email.

    SharePoint
  1. Fill in all the required details as shown below,

    SharePoint
  1. Click Next step and then click Add a condition.

    SharePoint
  1. Set the condition as shown below,

    SharePoint
  1. If condition is satisfied, add an action to update the Status field to Approved.

    SharePoint
  1. Search for Update Item and then select SharePoint – Update item.

    SharePoint
  1. Make sure you are connected to your SharePoint Online site and fill in all the required details as shown below,

    SharePoint

  2. If the condition is not satisfied, add an action to update the Status field value to Rejected.

    SharePoint
  3. Enter the name for the flow and click Create flow.

    SharePoint
  1. Flow created successfully. Click Done.

    SharePoint

Testing the app and approval process

  1. Navigate to custom list (Change Request) in SharePoint Online site. For example, 

    https://c986.sharepoint.com/sites/Vijai/Lists/Change%20Request/AllItems.aspx

  2. Click All Items drop down to view options and then click ChangeRequest App which we have created 

    SharePoint
  1. Open the app.

    SharePoint
  1. Click “+” icon to create new item.

    SharePoint
  1. Enter the details and click tick icon. 

    SharePoint
  1. Item is created successfully. Approver (I have added myself – Vijai Anand Ramalingam as approver) will receive an email to approve or reject in Office 365 Outlook.

    SharePoint
  1. Click "Approve".

    SharePoint
  1. Navigate to list and you could see the Status field got updated to Approved.

    SharePoint

Result

In this article, you saw how to create a simple approval app using PowerApps and Flow in SharePoint Online.

Up Next
    Ebook Download
    View all
    Learn
    View all