Login page using SharePoint & PowerApps

Expected outcome:

 

SharePoint

In order to store the username and password, user should first create a “list” in SharePoint

 

Simply name it as “access_account”

 

Use “Quick Edit” to add two column, “username” & “password”

 

For testing, Right Click > New and add “edward” as username, “123” as password

 

PowerApps

Move to the PowerApps application, open existing project / new project

 

Create two new Screens (name it : “loginScreen” & “HomeScreen”). When we have successfully create the login function, it will redirect user into Screen called “HomeScreen”, therefore, the “HomeScreen” here is for display purpose only, it is not involved in the login function.

 

Add new text inputs for username/password input

 

Remember to name the username/password input for data access

 

Make use the hint text attribute

 

To create the login matching, on the onSelect attribute of the button

 

Create simple matching function, logic explained as the following:

  1. We search for the “username.Text” (the value of username input field) within the database “access_account”
  2. If username exists in the list, we lookup for the “Password” field on the SAME ROW
  3. If the lookup result of (2) return equal to “password.Text”, the HomeScreen is navigated.

 

Error Tips:

Microsoft SharePoint is slightly different from the usual database, for instance, the attribute value does not necessarily match the original value. For instance, we defined “username” and “password” on the SharePoint list , however, it is interpreted as “Title” and “Password” (case sensitive) in the list (in one of my case, it varies with different list). To effectively find out the actual attribute name needed for coding, we can insert a new form and check for the actual value needed, here’s the little tricks.

 

1. Try to insert form

 

2. Press “Connect to data” and connect to the “access_account” list, locate it on the right toolbar

 

3. Find the real attribute name by searching though the field

 

4. In this case, “OData_x0061_ma5” is the real attribute of “password” while “Title” is for “username”

The button function should be modify into:

If(LookUp(access_account, Title = username.Text, OData_x0061_ma5) = password.Text,
Navigate([@HomeScreen], ScreenTransition.Fade),
“”)