PowerApps submit form to SharePoint Online list

In this PowerApps Tutorial, We will discuss how to save data or items to a SharePoint Online list using a PowerApps Form. Also, We will see how to connect the SharePoint Online List to PowerApps app and submit the Powerapps form data to the SharePoint list.

By taking a simple scenario, We will see how to clear the previous text, reset the Powerapps Edit form and save the data to the SharePoint Online list. so that anyone can understand easily.

PowerApps Save Data to SharePoint List

Coming to the example, I have a SharePoint Online List named SharePointTraining. This training list has below columns with different data types:

  • Title: By default, this is a Single line of text data type column.
  • FullName: This is the column that I have created with a Single line of the text data type.
  • Course: This is the Choice type column that contains some choice values like SharePoint, PowerApps, Power BI, etc.
  • Trainer: This is also a single line of text data type column.

In this example what I want to do is, When a user will enter these field values (Title, Full name, Course, and Trainer) in the Powerapps form, then the user entered data will be saved in the SharePoint Online List (SharePoint Training).

If you are new to PowerApps, then you can read this article: Create your First form using Microsoft PowerApps in SharePoint Online.

The below screenshot represents the various columns of the SharePoint Online List (SharePoint Training).

PowerApps save data to SharePoint list
PowerApps save data to SharePoint list

Read Power Apps Button Control

Create a PowerApps form for SharePoint Online List

Once the SharePoint Online List is ready, next it’s time to create a PowerApps Form where you can enter the data. When you will submit the form, then all the data will save into the SharePoint Online List. Follow these below process to do so:

  • Sign in to the PowerApps app.
  • Go to the Apps tab (left navigation) from the Home page -> Click on + Create an app -> Select Cavas as shown below.
PowerApps create an item in SharePoint list
PowerApps create an item in SharePoint list
  • Next, you need to choose an app layout either a Phone or Tablet layout. Select any layout under the Blank app template section. For this example, I have chosen a Phone layout.
PowerApps add SharePoint list
PowerApps add SharePoint list
  • Once you will choose any app layout, then a new Blank PowerApps screen will appear having with that particular layout (Phone layout). By using that screen, you can design your page by taking your desired input controls.
  • On the PowerApps Blank screen, Insert these below Powerapps Input controls as:
  1. Label: Insert one Label control for heading purpose. You can provide any heading by using its Text property.
  2. Button: Add two Buttons. One Button control is for item submitting purpose and another one is for item clearing purpose. I just renamed these two-button control names as Submit and Clear.
PowerApps create an item in SharePoint list
PowerApps create an item in SharePoint list
  • Now you need to connect the SharePoint Data source to the Powerapps app or form. To connect the SharePoint list to the app, go to View tab -> Data sources -> Create a new or an existing connection by providing your Microsoft credentials -> Enter the SharePoint Online Site URL (where the SharePoint Online list is present) -> Next Click on “Go“.
PowerApps submit the form to SharePoint  list
PowerApps submit the form to SharePoint list
  • After doing these above steps, the SharePoint Data source connector is connected to the Powerapps app. Next, it will ask you to choose the SharePoint list.
  • Select the SharePoint Online list (SharePointTraining) and then hit on the Connect button as the below screenshot.
PowerApps add item to sharepoint list
PowerApps add item to sharepoint list
  • Add one PowerApps Edit form where users can enter field values. Go to Insert tab -> Forms -> Select Edit as shown below.
insert data into sharepoint list using powerapps
insert data into sharepoint list using powerapps
  • Now a Powerapps blank edit form will appear on the PowerApps screen. Once you will click on the edit form, then it will ask you to connect the data. Select the SharePoint list data source (SharePointTraining) that you have connected previously.
powerapps insert data into sharepoint list
powerapps insert data into sharepoint list
  • When you will add the SharePoint list data source to the Powerapps edit form, you can see the form by using the Preview option. Save and Preview (F5) the app.
  • Once you will preview the app, you can see an empty page will appear because still the SharePoint Online list (SharePointTraining) is not connected to the PowerApps form.
powerapps connect to sharepoint list
powerapps connect to sharepoint list
  • To view the SharePoint Online list fields in the Powerapps Edit form, we need to specify some formula on the Clear button’s OnSelect property.
  • Select the Clear button and apply this below formula on its OnSelect property as:
OnSelect = NewForm(Form1)

Where,

Form1 = PowerApps Edit Form name

  • Once again Preview (F5) the app and click on the Clear button, you can able to view all the fields of SharePoint Online List (SharePoint Training) in the PowerApps Edit form.
PowerApps save to sharepoint custom list
PowerApps save to sharepoint custom list
  • Similarly if you want to clear all the text boxes, then add this below formula on Clear button’s OnSelect Property as:
OnSelect = ResetForm(Form1); NewForm(Form1)

Where,

Form1 = PowerApps Edit Form name

powerapps reset form
powerapps submit form to sharepoint Online list
  • Next, to submit the items or field values to the SharePoint Online list (SharePointTraining), we need to specify the formula on the Submit button’s OnSelect property.
  • Select the Submit button and apply this below formula on its OnSelect property as:
OnSelect = Submit(Form1);NewForm(Form1)

Refer the below screenshot.

insert data into sharepoint list using powerapps

insert data into sharepoint list using powerapps
  • That’s it for the app. Now Save and Preview (F5) the app. Enter all the field values by using text box control and then just hit on the Submit button as like the below screenshot.
powerapps clear form button
powerapps submit form to sharepoint online list
  • Once you submit the data, go to the SharePoint Online List (SharePointTraining). You can see all the user data has been saved into the SharePoint list as shown below.
powerapps form save button
powerapps submit form to sharepoint list

Also, you may like these below PowerApps tutorials:

In this PowerApps Tutorial, We discussed how to save data or items to a SharePoint Online list using a PowerApps Form. Also, We saw how to connect the SharePoint Online List to PowerApps app and submit the Powerapps form data to the SharePoint list.

Also by taking a simple scenario, We learned how to clear the previous text, reset the Powerapps Edit form and save the data to the SharePoint Online list.

  • When I put in the necessary info for the Submit button for OnSelect, it gives me an error that says, “Invocation of unknown or unsupported function.” What do I do?

  • >