Automatically filling in the details when logging into an application frequentlycan be useful for quick access. This is possible by using the Remember Me feature/option during Power Apps login.
In this Power Apps article, I will show you how to create Login page in Power Apps using SharePoint and Remember Me option step by step.
Look at the gif below.
Table of Contents
How to Create Login Page in Power Apps Using SharePoint
Here, I have a SharePoint list called Event Registration Form that stores registered users’ UserID and Password credentials.
We’ll check the user credentials from this SharePoint list to log in to an application. If the user exists, it will successfully log in to some page. Otherwise, it will show an error.
Refer to the table below, which contains the above SharePoint list columns and their data type.
| Column Name | Data Type |
|---|---|
| UserID | Title(Single line of text) |
| Password | Single line of text |
| First Name | Single line of text |
| Last Name | Single line of text |
| Email Address | Single line of text |
| Phone Number | Single line of text |
Follow the steps below to achieve this!
1. Create one blank Power Apps application. Then, add the following controls to the app.
- Two Text Inputs – For UserID, Password.
- Two Text labels – For UserID, Password.
- One Button Control – For login.
- Add User, Lock, and View icons if you want.
Design the screen with the above controls as shown below.
2. Now, connect with the SharePoint list from Data in the Power Apps navigation.
3. Provide the formula below in the screen’s OnVisible property. It will convert the text in the password field to dots.
Set(lblview,TextMode.Password);Here, TextMode.Password will hide the actual text with dots for security. Now, it is assigned to the lblview variable with the Set function.
4. Now, use that variable in the Mode property of the password text input control.
5. Provide the formula below in the OnSelect property of the View Icon. Then, save the changes.
Set(lblview,TextMode.SingleLine)It will convert the dots in the password field into text.
6. Provide the formula below in the OnSelect property of button control.
Set(VarUserID, txt_userID.Text);Set(VarPassword,txt_password.Text);Set(VarUserExist,!IsBlank(LookUp('Event Registration Form',Title = VarUserID )));If( !VarUserExist, Set(varErrorMessage,"User ID not found"), If(LookUp('Event Registration Form',Title = VarUserID ).Password = VarPassword, Set(varErrorMessage,""); Navigate(Event_CompleteDetails_screen), Set(varErrorMessage, "Password is incorrect.") ));In this code,
- VarUserID and VarPassword are the variables that contain the text entered in the UserID text input control(txt_userID) and Password text input control(txt_password).
- The VarUserExist variable holds the LookUp() value. This lookup function checks whether the user ID value is present or not in the SharePoint list.
- varErrorMessage is the variable used to display the error message if the user ID or Password does not exist.
- The Title and password are the column names in the Event Registration Form.
- Event_CompleteDetails_screen is the screen name containing the events’ details in Power Apps.
The above code will check whether the User ID is in the SharePoint list. If present, it will again check its password. If that password is matched, it will navigate to another screen.
Otherwise, it displays an error message for the password. If the user ID does not exist in SharePoint, it will display an error message.
7. Now, add one text label to display the error message. Then, add the variable that contains an error message in the Text property of the label.
Text: varErrorMessage
8. Save the changes and preview the app once. After providing the correct User credentials, it logs to another screen. It displays an error message if we enter the wrong password or a user ID that does not exist.
In this way, we can create the login form in Power Apps.
How to Implement Remember Me in Power Apps Login Page
In Power Apps login forms, we can use the Remember Me functionality to auto-fill the passwords for users who log in regularly. This makes the login process quicker and easier.
Look at the example below. After clicking the remember me check box while logging in, the password auto-fills next time.
Follow the steps below to achieve this.
1. Add one Check box control to the Power Apps login form. Then, provide the below name in its Text property.
Text : "Remember Me"
2. In the OnCheck property of the check box, provide the formula below.
ClearCollect( UserCredentials, { UserID: txt_userID.Text, Password: txt_password.Text })This formula creates a collection to store the user ID and Password. Here, UserCredentials is the collection name, and txt_userID and txt_password are the text input control names for user ID and password.
3. Now, in the OnSelect property of the login button, add the below formula.
If( chk_RememberMe.Value, Set(LocalUserCredentials,UserCredentials),"");Here, chk_RememberMe is the checkbox control name, and LocalUserCredentials is the variable containing the UserCredentials values.
So, when this Remember Me checkbox is clicked, the userID and password will be set into the LocalUserCredentials.
4. Provide the formula below in the Default property of the password text input control.
LookUp(LocalUserCredentials,UserID=txt_userID.Text,Password)This will fetch the password and populate it in the password text input control when we type userID.
Now, save the changes and preview the app. After clicking the Remember me check box while logging in, the password will populate automatically when you enter the User ID next time.
Moreover, you may like some more Power Apps articles:
- Update SharePoint List Item Using Power Apps Patch Function
- Get Selected User Manager Name By Default in Power Apps
- Link to a Specific Screen in Power Apps
- PowerApps Play Video From SharePoint
- How to Use Power Apps DropDown Control
- Power Apps Delegation Warnings
- Create Cascading Dropdown in Power Apps
I hope you found this article useful. I have explained how to create a login form in Power Apps using the SharePoint list and how to autofill the password using the Remember me in the Power Apps login form.
You can follow the steps that I have explained above whenever you are trying to create a login form and need to populate the user credentials.
Bijay Kumar
After working for more than 15 years in Microsoft technologies like SharePoint, Office 365, and Power Platform (Power Apps, Power Automate, and Power BI), I thought will share my SharePoint expertise knowledge with the world. Our audiences are from the United States, Canada, the United Kingdom, Australia, New Zealand, etc. For my expertise knowledge and SharePoint tutorials, Microsoft has been awarded a Microsoft SharePoint MVP (9 times). I have also worked in companies like HP, TCS, KPIT, etc.
