Connecting Your Canvas App to a SharePoint List: Adding, Editing, and Deleting Records with a Basic Form

Introduction

Imagine your team is managing equipment requests on a shared Excel spreadsheet emailed around every Monday morning. Someone adds a row, someone else overwrites it, and by Friday the file has three conflicting versions sitting in people's Downloads folders. You've been asked to fix this — fast, and without building a full custom application from scratch. This is exactly the problem Power Apps was designed to solve, and SharePoint Lists are the natural backend for it.

By the end of this lesson, you'll have a working Canvas App that connects to a SharePoint List and lets users add new records, edit existing ones, and delete records they no longer need — all through a clean, functional form. You won't need to write server-side code, manage databases, or know anything about APIs. What you will need is a basic familiarity with the Power Apps canvas editor, which you can get by working through Build Your First Canvas App in Power Apps before continuing here.

What you'll learn:

• How to connect a Canvas App to a SharePoint List as a data source
• How to use the built-in Edit Form and Display Form controls to show and capture data
• How to wire up buttons to add new records, submit changes, and delete existing entries
• How the SubmitForm, NewForm, EditForm, and Remove functions work
• How to use a Gallery control to display records and drive the form's editing context

---

Prerequisites

Before starting this lesson, you should:

• Have access to Power Apps (via Microsoft 365 or a Power Apps trial)
• Have access to a SharePoint site where you can create a list
• Understand the basic Power Apps canvas editor — screens, controls, and the formula bar
• Be comfortable clicking around the Power Apps Studio interface

No coding background is required. Every formula we use will be explained from scratch.

---

Setting Up Your SharePoint List

Before your app can talk to SharePoint, you need something for it to talk to. We'll create a simple Equipment Request List — a realistic scenario that most organizations deal with in some form.

Creating the List

Navigate to your SharePoint site and click the gear icon (Settings) in the top-right corner, then choose Site contents. Click New → List → Blank List. Name it Equipment Requests and click Create.

SharePoint gives every list a Title column by default. We'll keep that and add a few more. In your new list, click the + icon in the column header row to add each of the following columns:

• RequestedBy — Single line of text
• EquipmentType — Choice column, with options: Laptop, Monitor, Keyboard, Mouse, Headset
• Quantity — Number
• Status — Choice column, with options: Pending, Approved, Rejected
• Notes — Multiple lines of text

Your list now has enough structure to make a genuinely useful app. Each row (called a record in Power Apps terminology) represents one equipment request. Each column is a field on that record.

---

Connecting the SharePoint List to Your Canvas App

Open Power Apps Studio by navigating to make.powerapps.com, clicking Create in the left navigation, and choosing Blank app → Blank canvas app. Name it Equipment Request Manager, choose Tablet layout, and click Create.

Once you're inside the editor, look at the left panel. You'll see icons for the Tree view, Insert, Data, and Media tabs. Click the Data tab (it looks like a cylinder or table icon). Then click Add data.

In the search box that appears, type SharePoint. Select the SharePoint connector. You'll be prompted to connect to a site — paste in your SharePoint site URL (e.g., https://yourcompany.sharepoint.com/sites/Operations) and click Connect. Power Apps will load the lists available on that site. Find Equipment Requests in the list and click it to add it as a data source.

You've just established a data connection. Power Apps can now read from and write to that list. For a deeper explanation of how this connection works under the hood, see Connecting Power Apps to SharePoint, Excel, and Dataverse: A Complete Integration Guide.

---

Building the Gallery: Displaying Your Records

A Gallery control is a repeating container — it loops through every record in your data source and displays it. Think of it as a smart list that renders one template layout for every row in your SharePoint list.

Adding the Gallery

Click the Insert tab (the + icon in the left panel), expand Layout, and choose Vertical gallery. A gallery will appear on your screen with some placeholder data. Drag and resize it so it occupies the left third of your screen — we'll put the form on the right two-thirds.

With the gallery selected, look at the property panel on the right (or use the formula bar at the top). Find the Items property and set it to:

Equipment Requests

The gallery now pulls live data from SharePoint. You should see your list columns appear inside each gallery card. By default, Power Apps will try to auto-populate the gallery template with some of your fields. Let's make it cleaner.

Configuring the Gallery Template

Click once on the gallery to select it, then click once again on any item inside the gallery to enter the template editing mode. You're now editing what a single card looks like.

Click the text label that shows a title field. In the formula bar, set its Text property to:

ThisItem.Title

Add a second label below it. Set its Text property to:

ThisItem.RequestedBy & " — " & ThisItem.Status

This uses the & operator to concatenate (join) two text values with a separator. When you exit template mode (click anywhere outside the gallery), you'll see each card now shows the request title and the requester's name alongside the current status.

---

Building the Form: Displaying and Editing Records

Now for the core of the app. A Form control in Power Apps is purpose-built for reading and writing structured data. It handles the rendering of fields, tracks which record is selected, and knows how to push changes back to your data source.

Adding an Edit Form Control

Click Insert → Forms → Edit. An Edit Form will appear — drag it to the right two-thirds of your screen. With the form selected, configure these properties:

DataSource property (in the formula bar, with the form selected and "DataSource" chosen in the property dropdown):

'Equipment Requests'

Item property — this tells the form which record to display. Set it to:

Gallery1.Selected

This is the magic link between your gallery and your form. Whenever a user clicks a card in the gallery, Gallery1.Selected updates to point to that record, and the form automatically loads all of that record's field values.

Choosing Which Fields to Show

With the form selected, look at the Fields panel that appears on the right (you may need to click Edit fields to open it). You can click the + Add field button to add any columns from your SharePoint list. Add: Title, RequestedBy, EquipmentType, Quantity, Status, and Notes.

Power Apps automatically picks appropriate input controls for each field — a text input for short text columns, a dropdown for choice columns, a number input for number columns, and so on. You can rearrange the order by dragging the fields in this panel.

---

Wiring Up the Buttons: New, Submit, Edit, and Delete

Having a form that displays data is useful. Having buttons that let users act on it is what makes the app functional. Let's add four buttons and give each one the right formula.

The "New Request" Button

Insert a Button control (Insert → Button) and place it above or below the gallery. Set its Text property to "New Request". Now set its OnSelect property to:

NewForm(Form1)

The NewForm() function tells the form to clear all its current values and switch into New mode — ready to accept input for a fresh record. The form no longer shows any existing record's data.

The "Save" Button

Insert another button. Set its Text to "Save". Set its OnSelect property to:

SubmitForm(Form1)

SubmitForm() does several things in one step: it validates the form's input, packages all the field values into a record, and either creates a new row (if the form is in New mode) or updates the existing row (if the form is in Edit mode) in your SharePoint list. It handles the communication with SharePoint entirely — you don't need to write any additional code.

The "Edit" Button

This one is subtle. By default, when the form loads a record from Gallery1.Selected, it's in View mode — read-only. To allow editing, you need to explicitly switch it to Edit mode.

Insert a button, set its Text to "Edit", and set OnSelect to:

EditForm(Form1)

Now the form's input fields become interactive, and the user can modify values before hitting Save.

The "Delete" Button

Deletion is the most consequential action in any data app, so it's worth understanding exactly what happens here. Insert a button, set Text to "Delete", and set OnSelect to:

Remove('Equipment Requests', Gallery1.Selected);
ResetForm(Form1)

The Remove() function takes two arguments: the data source you want to remove from, and the specific record to remove. Gallery1.Selected points to whichever row the user currently has highlighted in the gallery.

After removing the record, ResetForm(Form1) clears the form so it doesn't keep showing a deleted record's data.

---

Understanding Form Modes: New, Edit, and View

It's worth pausing to understand the three modes a form can be in, because getting this wrong is one of the most common beginner mistakes.

Mode	How you enter it	What it does
View	When the form loads with an Item	Shows read-only field values
Edit	By calling EditForm(Form1)	Makes fields interactive for changes
New	By calling NewForm(Form1)	Clears fields for a fresh entry

When you call SubmitForm():

• In New mode, it creates a new row in SharePoint
• In Edit mode, it updates the row referenced by the form's Item property

This is why you don't need separate "Create" and "Update" functions — the form tracks its own mode and SubmitForm() behaves accordingly. If you want to understand the underlying Patch() function that SubmitForm() uses internally (which gives you more granular control), see Power Apps Collections and Local Data Management: Mastering ClearCollect, Patch, and In-Memory Data Operations.

---

Polishing the Experience: A Few Essential Touches

Your app is functional, but there are three quick improvements that make it genuinely usable.

Disabling Save When Nothing Is Selected

Right now, a user can click "Save" without any record selected or any fields filled in. Set the DisplayMode property of your Save button to:

If(Form1.Unsaved, DisplayMode.Edit, DisplayMode.Disabled)

Form1.Unsaved is a boolean (true/false) property that becomes true the moment a user changes any field in the form. When nothing has changed, the button stays grayed out. This prevents accidental empty submissions.

Disabling Edit and Delete When No Record Is Selected

Similarly, the Edit and Delete buttons shouldn't be available when the gallery has no selection. Set their DisplayMode to:

If(IsBlank(Gallery1.Selected.ID), DisplayMode.Disabled, DisplayMode.Edit)

Gallery1.Selected.ID refers to the SharePoint list item's unique identifier. When no card is selected, this is blank, and the buttons disable themselves.

Highlighting the Selected Gallery Item

By default, it can be hard to tell which gallery card is selected. Click into the gallery template and select the background rectangle of a card. Set its Fill property to:

If(ThisItem.IsSelected, RGBA(0, 120, 212, 0.1), RGBA(255, 255, 255, 1))

This gives the currently selected card a subtle blue tint, providing the visual feedback users expect.

---

Hands-On Exercise

Build the complete Equipment Request Manager described in this lesson, then extend it with the following:

1. Add a search bar. Insert a Text Input control above the gallery. Set the gallery's Items property to:

   Filter('Equipment Requests', StartsWith(Title, TextInput1.Text))
   

   This filters the gallery in real-time as the user types. Understanding Power Apps Data Sources Explained: Tables, Records, and Collections for Absolute Beginners will help you understand why Filter() works the way it does here.

2. Add a status filter. Insert a Dropdown control with choices: All, Pending, Approved, Rejected. Modify the gallery's Items formula to also filter by status when the dropdown selection isn't "All":

   Filter(
     'Equipment Requests',
     StartsWith(Title, TextInput1.Text),
     Dropdown1.Selected.Value = "All" || Status.Value = Dropdown1.Selected.Value
   )
   

3. Add a record count. Insert a label somewhere on the screen and set its Text property to:

   CountRows(Gallery1.AllItems) & " requests shown"
   

4. Test every flow. Add three test records, edit one, delete another, and confirm the gallery reflects the changes.

---

Common Mistakes & Troubleshooting

"My form doesn't update when I click a gallery card." Check that the form's Item property is set to Gallery1.Selected. If you renamed your gallery, use whatever name appears in the Tree view. Also confirm the form's DataSource property matches your list name exactly.

"SubmitForm doesn't seem to do anything." This almost always means the form doesn't have a valid DataSource set, or the DataSource name is misspelled. Open the form's properties and double-check. Also check if there are any validation errors on required fields — Power Apps silently blocks submission when validation fails. For deeper diagnosis, Debugging Canvas Apps: Using the Power Apps Monitor Tool and Formula Errors to Fix Issues Fast walks through exactly how to trace what went wrong.

"My choice field shows as a text box instead of a dropdown." If Power Apps isn't detecting the column type correctly, go to the form's Fields panel, remove the field, and re-add it. Power Apps should re-detect it as a choice column and render a dropdown.

"After deleting a record, the form still shows the deleted record's data." You need ResetForm(Form1) after your Remove() call, as shown in the Delete button formula above.

"The gallery shows 'No items to display' even though my list has data." Confirm the gallery's Items property is set to the exact name of your data source (e.g., 'Equipment Requests'). Also verify the SharePoint connection is still active in the Data panel — sometimes connections need to be refreshed after a session expires.

---

Summary & Next Steps

You now have a fully functional Canvas App backed by a SharePoint List. Users can browse records in a gallery, tap a card to load it into a form, edit fields, save changes, add brand-new records, and delete entries they no longer need — all without touching SharePoint directly.

Here's what made it work:

• The SharePoint connector gave Power Apps permission to read and write your list
• The Gallery control displayed all records and provided a Selected reference that drove everything else
• The Edit Form control managed field rendering, mode tracking, and data binding automatically
• NewForm(), EditForm(), SubmitForm(), and Remove() handled the full CRUD lifecycle

This is a solid foundation, but there's plenty of room to grow. Here are natural next steps:

• Add data validation to prevent bad submissions — for example, requiring Quantity to be greater than zero. Power Apps Data Validation: Using If, IsBlank, and IsMatch to Prevent Bad Data in Forms covers exactly this.
• Add multiple screens so the list view and the form live on separate screens for a cleaner mobile experience. See Building Multi-Screen Apps with Navigation and Variables in Power Apps for a step-by-step guide.
• Share the app with your team. Once you're satisfied with how it works, you'll want to publish and distribute it — that process is covered in Publishing and Sharing Your Canvas App: Environments, Versions, and App Distribution for End Users.

You've just replaced a chaotic shared spreadsheet with a proper multi-user data entry tool. That's not a small thing.