00:00:00
hello everyone razza here in this video
00:00:03
I will show you how to build a custom
00:00:06
approval form process in power apps we
00:00:10
will orchestrate the entire approval
00:00:12
process from within power apps by using
00:00:15
the form control sending notifications
00:00:18
to approvers and design an approval
00:00:22
process where an approver can pick the
00:00:24
next approver in sequence so let's go
00:00:28
ahead and check it out in action
00:00:32
[Music]
00:00:37
I have a SharePoint list called expense
00:00:40
request
00:00:41
list since I'm trying to design an
00:00:44
approval process I would like to
00:00:47
maintain the information about the
00:00:50
approval and for that I have added
00:00:53
additional columns to my
00:00:57
list the First Column that I have added
00:01:00
is called approval
00:01:02
status it's a choice column that has
00:01:05
three values pending approved and
00:01:09
rejected the default value I have set as
00:01:13
pending meaning any new expense that is
00:01:17
created the approval status will start
00:01:21
from
00:01:23
pending I also have a person type column
00:01:26
called
00:01:28
approver here I will store the details
00:01:30
of the current
00:01:33
approval approval commands is a column
00:01:36
of type multi lines of
00:01:39
text and finally I have a column of type
00:01:43
multi-line of text called approval
00:01:46
history this is where I would like to
00:01:49
store the entire history of the approval
00:01:53
process whenever an expense is submitted
00:01:57
the first approval would be the users's
00:01:59
manager
00:02:01
the manager can take the approval
00:02:03
decision either approve or reject or
00:02:06
transfer the approval to another
00:02:09
approver that they can do by selecting
00:02:12
who the next approver
00:02:15
is let's go ahead and build a power app
00:02:18
that will connect to that SharePoint
00:02:21
list I'll start with a page
00:02:25
design I leverage the design gallery
00:02:28
connected to sh SharePoint I'll select
00:02:32
this creates the
00:02:35
connection I can put my SharePoint site
00:02:38
URL
00:02:40
connect and pick the SharePoint
00:02:45
list I'll click create
00:02:48
app this will begin the process of
00:02:51
creating a single screen power app
00:02:54
experience that will allow the user to
00:02:56
perform full crud operations create
00:02:59
delete update and delete against that
00:03:02
connected expense request
00:03:05
list here's the app I can click on new
00:03:10
the form experience lights up which
00:03:12
allows me to enter the expense
00:03:16
details now let's make modifications to
00:03:19
this form
00:03:21
experience in the main container is
00:03:23
where the form control is
00:03:26
placed columns I'll set to three
00:03:30
so this will place the columns in a
00:03:32
three column
00:03:34
format I also have the option to
00:03:37
reposition The Columns in the
00:03:40
form I've gone ahead and done
00:03:44
that for the form
00:03:47
Fields I'll go and insert a custom
00:03:52
card I'll use this to create a sectioned
00:03:56
experience in the
00:03:57
form I'll position this card
00:04:00
right before the approval
00:04:02
columns expand its width reduce its
00:04:06
height and in this
00:04:09
card I'll insert a label
00:04:13
control I'll call this approval
00:04:19
information now when the user is
00:04:21
creating a new expense
00:04:25
request approval status by default will
00:04:28
be set to
00:04:31
pending so this data card should not be
00:04:34
visible if the form is in new
00:04:37
mode the approval status data
00:04:40
card visible
00:04:42
property I'll change this to my form
00:04:45
control which is called form
00:04:48
one. mode is not equal to form mode.
00:04:54
new so notice the approval status column
00:04:59
is hidden when the user is creating a
00:05:01
new
00:05:03
item
00:05:05
approver who should be the current
00:05:08
approver for the expense
00:05:10
request when a new item is being created
00:05:14
this should be the current users
00:05:18
manager to do that I'll go to data add
00:05:24
data and use the Office 365 users
00:05:28
connector
00:05:30
this connector has a function that
00:05:33
allows me to get the manager
00:05:35
details that I would like to store in a
00:05:40
formula the app object has a property
00:05:44
called
00:05:46
formulas so I'll give this a
00:05:48
name I'll call it user manager and its
00:05:51
value will be Office 365 users dot
00:05:57
manager
00:05:58
V2 and it requires the ID of the current
00:06:01
logged in
00:06:02
user that we can get from the user
00:06:05
function that exposes a property called
00:06:08
entra object
00:06:11
ID so this will get me the current users
00:06:15
manager
00:06:16
information and this is what I would
00:06:19
like to plug in as the default value of
00:06:23
the approv data
00:06:25
card to make changes to a data card we
00:06:28
have to first unlock the data
00:06:32
card and I would like to change the
00:06:34
default property depending upon the mode
00:06:37
of the
00:06:39
form I'll switch on form. mode if the
00:06:45
mode is form mode. new then I would like
00:06:48
to put the current users
00:06:51
manager for now I'll use the named
00:06:54
formula which is user
00:06:56
manager
00:06:58
else I use this item.
00:07:02
approver format
00:07:04
text user
00:07:06
manager if you
00:07:08
explore it has gone and picked my
00:07:10
manager information from ad but the data
00:07:15
card is not defaulting to my user that's
00:07:19
because approver is a person type
00:07:23
column I wrote a blog post around how to
00:07:27
patch data to SharePoint
00:07:30
and in here I covered different types of
00:07:32
SharePoint columns and one of them is
00:07:35
the person column the way we set values
00:07:39
for the person type column is as
00:07:41
follows so I'll simply go and copy
00:07:45
this go back to my power app approv a
00:07:49
data card default value instead of user
00:07:53
manager I'll just paste that
00:07:55
code format
00:07:58
text now now it shows a value for the
00:08:00
approver it's the current logged in user
00:08:03
itself which is me
00:08:05
Raza but I need the manager
00:08:08
information all I have to do replace the
00:08:11
user object details with the information
00:08:14
coming from my named formula user
00:08:18
manager here I need the email I'll use
00:08:21
user manager.
00:08:23
mail here I need the full name user
00:08:27
manager. display name
00:08:30
here as well I need the
00:08:32
email and if You observe the data card
00:08:35
it has defaulted to my manager which is
00:08:39
Sarah now this data card is something
00:08:42
that I do not want to allow the user
00:08:45
creating the request to
00:08:47
change the data card has a property
00:08:49
called display mode let's change this as
00:08:53
follows if the mode of my form is
00:08:57
edit then you respect the display mode
00:09:01
of the form else you set the display
00:09:05
mode to view so now I cannot change
00:09:10
it approval commands should only be
00:09:13
visible to the approver which would be
00:09:16
the user editing the item so the visible
00:09:20
property my form. mode is it equal to
00:09:24
form mode. edit currently it's a new
00:09:27
form so it's hidden
00:09:30
for approval history this is where I
00:09:33
will track the entire process of my
00:09:36
approval I'll unlock this
00:09:40
card it's default value I would like to
00:09:43
change as
00:09:44
follows if this is a new form I would
00:09:48
like to plug in details in the approval
00:09:50
history around who this approval is
00:09:53
assigned
00:09:54
to I'll create this
00:09:57
demarcation now gives me the current
00:09:59
date and time use the same
00:10:03
demarcation it's a simple string ENT
00:10:06
allows me to concatenate
00:10:08
string double
00:10:10
codes enter to go to a new line approval
00:10:15
assign
00:10:16
to the users's
00:10:19
manager
00:10:20
comma if it's not the new form just keep
00:10:24
the original value format text
00:10:29
this data card just span its
00:10:32
width and
00:10:35
preview current date and time approval
00:10:39
assign to whoever the approver
00:10:42
is this data card is not something I
00:10:45
would like to show to the user when they
00:10:48
are creating or editing the item so the
00:10:51
visible
00:10:53
property I will set as form. mode is
00:10:57
form mode. View
00:11:00
so at this point if I was to preview the
00:11:03
app when a user clicks on a new expense
00:11:06
request they get the expense form to
00:11:09
fill
00:11:10
out any mandatory fields that I've
00:11:12
defined in my SharePoint list will be
00:11:15
respected the approval info section will
00:11:17
only show me the approval to begin with
00:11:20
and please note none of the approval
00:11:22
columns I have set as mandatory in my
00:11:25
data source I will handle the mandatory
00:11:29
law loic later when the approver comes
00:11:31
into picture in the app so at this point
00:11:35
the user can submit an expense
00:11:40
request the user can also attach files
00:11:43
as part of the expense
00:11:46
request and submit the
00:11:50
request the expense request is
00:11:52
created I can view the details of the
00:11:56
submitted
00:11:57
request the approval status is pending
00:12:01
the approver is Sarah and the approval
00:12:05
history has started tracking the
00:12:08
information when we submit the form we
00:12:12
would need to send an email notification
00:12:14
to the
00:12:16
approver whenever data is submitted in
00:12:18
the form control and when it does it
00:12:22
successfully it will trigger a property
00:12:24
in the form control called on
00:12:27
success this is what the formula looks
00:12:31
like this is where I would like to send
00:12:34
the notification email to the
00:12:37
approver the email should go to the
00:12:39
approver if the approval status of the
00:12:42
request is
00:12:44
pending I'll use the formula if form one
00:12:49
which is the name of the form in my case
00:12:52
do last submit meaning the last
00:12:56
submitted instance of the form for for
00:12:59
the current logged in user session go
00:13:01
and grab that and from here get the
00:13:06
approval status which is a choice column
00:13:09
so get me its
00:13:10
value if that is equal to
00:13:14
pending then I would like to send an
00:13:17
email to send the
00:13:21
email I'll go and connect to Office 365
00:13:27
Outlook so if the status is
00:13:30
pending Office 365
00:13:33
outlook. send email
00:13:36
V2 who do you want to send the email to
00:13:40
form do last submit do approver that's
00:13:46
the person type column that has the
00:13:48
information about the current
00:13:50
approver I'll pick the email address of
00:13:52
that
00:13:54
user
00:13:56
subject expense request approval
00:14:00
erson to concatenate this with form.
00:14:03
lsub submit.
00:14:05
tile comma the body of the email here I
00:14:10
can use
00:14:11
HTML I'll start with expense request
00:14:14
submitted by and I'll put the name of
00:14:17
the user who submitted the expense form.
00:14:21
last submit do created by display name
00:14:25
will give me that
00:14:26
info to this I add a line break I'll
00:14:30
give an anchor tag I'll plug in the hrf
00:14:34
later the text form. last submit.
00:14:40
tile and I am free to add other pieces
00:14:43
of information right
00:14:46
here I can also set additional
00:14:48
attributes of the email for example the
00:14:51
importance of this email I'll set it to
00:14:55
high I'll close the send email function
00:14:59
close the if condition format
00:15:04
text in the email I would like to give a
00:15:09
link for the user to come to this
00:15:12
app for power apps the URL is apps.
00:15:18
power apps.com
00:15:20
slpl SL I need the ID of the
00:15:25
app I'll save the app and give it a name
00:15:31
I'll call it my expense
00:15:34
app I'll make sure I publish the
00:15:37
app head over to make. power
00:15:41
apps.com you should see your app
00:15:44
listed head over to
00:15:47
details and copy the app
00:15:52
ID back to the power app the link right
00:15:56
after play Slash
00:15:59
I'll put the ID of the
00:16:02
app but I also want that expense to be
00:16:05
directly selected in the screen and for
00:16:09
that I'll pass a parameter here I'll
00:16:13
call it ID so question mark ID all caps
00:16:18
equal
00:16:20
to two double quotes two
00:16:23
erson concatenating
00:16:26
this form. last sub submit dot the ID of
00:16:32
the item in SharePoint which will always
00:16:35
be
00:16:36
unique so the approver will get the
00:16:39
email they'll get this link and there
00:16:43
will be the parameter ID which will give
00:16:45
the context of the request item under
00:16:50
approval now I'll go to app
00:16:54
formulas here I would also like to read
00:16:58
that I ID
00:17:00
parameter so I'll create a named formula
00:17:02
called param
00:17:04
ID and use the function param of
00:17:09
ID exactly the same name as the
00:17:12
parameter I'm
00:17:14
passing I'll create another formula
00:17:17
called approval
00:17:19
item now I need to get the actual item
00:17:22
under
00:17:23
approval for that I will first check to
00:17:25
see
00:17:26
if not is
00:17:29
blank param ID then go and look up my
00:17:36
SharePoint
00:17:37
list where ID is equal to parm
00:17:44
ID if the parameter that's being passed
00:17:47
is blank then you set an empty object
00:17:51
for this approval
00:17:53
item
00:17:55
semicolon notice here it says inoma able
00:17:59
types that's because param ID although
00:18:03
it will be a number param function
00:18:05
returns it as a
00:18:07
string so we need to type cost this
00:18:10
using the value
00:18:13
function approval item has the context
00:18:16
of the
00:18:17
item if there is the ID parameter
00:18:22
available for the screen there is an
00:18:25
unvisible
00:18:27
property here
00:18:29
I would like to set the context of the
00:18:32
selected
00:18:33
item update context item selector
00:18:37
true current item this stores the
00:18:40
context of the current item to select in
00:18:42
the gallery this I will get from my
00:18:46
named formula which is approval
00:18:52
item if you enjoyed this video then do
00:18:55
like comment and subscribe to my YouTube
00:18:58
channel and thank you so much for
00:19:00
watching