Development

SharePoint Custom Forms with Power Apps: Complete Guide

Build custom SharePoint forms using Power Apps. Covers form customization, conditional visibility, validation, cascading dropdowns, and mobile-responsive design.

SharePoint Support TeamMarch 12, 202619 min read
SharePoint Custom Forms with Power Apps: Complete Guide - Development guide by SharePoint Support
SharePoint Custom Forms with Power Apps: Complete Guide - Expert Development guidance from SharePoint Support

SharePoint Custom Forms with Power Apps: Beyond Default Forms

Default SharePoint forms are functional but limited. They display every field in a single column, offer minimal validation, and provide no conditional logic. Power Apps custom forms transform SharePoint data entry into guided, intelligent experiences with conditional field visibility, multi-step forms, rich validation, and mobile-responsive layouts.

SharePoint search architecture showing crawl, index, and query
SharePoint enterprise search configuration

This guide covers form customization from basic formatting to advanced patterns used in enterprise deployments.

---

Getting Started with Power Apps Forms

Customizing a SharePoint Form

  • Open a SharePoint list
  • Click Integrate on the command bar then Power Apps then Customize forms
  • Power Apps Studio opens with a form connected to your list
  • Customize the form layout, fields, validation, and behavior
  • Click Publish to SharePoint to deploy

When published, the custom form replaces the default SharePoint form for creating and editing items. Users see your custom form when they click New or Edit in the list.

Form Modes

Power Apps SharePoint forms support three modes. New for creating items. Edit for modifying existing items. View for displaying items in read-only mode. Use the FormMode property to configure different behaviors for each mode.

---

Form Layout and Design

Multi-Column Layouts

Default forms display fields in a single column. Reorganize fields into multi-column layouts for more efficient use of screen space.

Create a horizontal container for each row of fields. Place field data cards side by side within containers. Set container widths to distribute fields evenly (50/50 for two columns, 33/33/33 for three columns).

Sections and Headers

Group related fields under section headers to create a logical flow. Use labels with larger font sizes and divider lines to separate sections. Common sections include General Information, Details, Dates and Deadlines, Approvals, and Attachments.

Tabs for Complex Forms

For forms with many fields, organize content into tabs. Create a tab control at the top of the form and show or hide field groups based on the selected tab. This prevents overwhelming users with 20 or more fields on a single screen.

---

Conditional Visibility

Showing and Hiding Fields

Use the Visible property on data cards to show or hide fields based on other field values. This creates dynamic forms that adapt to user input.

Example: Show Approval fields only when Status is Submitted

Set the Visible property of the Approver data card to:

```

DataCardValue_Status.Selected.Value = "Submitted"

```

Example: Show different fields based on Request Type

```

// Show Budget field only for Purchase Requests

DataCardValue_RequestType.Selected.Value = "Purchase Request"

// Show Travel fields only for Travel Requests

DataCardValue_RequestType.Selected.Value = "Travel Request"

```

Conditional Required Fields

Make fields required or optional based on context. Set the Required property of a data card dynamically.

```

// Justification required only for amounts over 10000

If(Value(DataCardValue_Amount.Text) > 10000, true, false)

```

---

Validation

Field-Level Validation

Add validation rules to individual fields to enforce data quality before submission.

Email validation:

```

IsMatch(DataCardValue_Email.Text, Match.Email)

```

Date range validation:

```

DataCardValue_EndDate.SelectedDate >= DataCardValue_StartDate.SelectedDate

```

Numeric range validation:

```

Value(DataCardValue_Budget.Text) >= 0 && Value(DataCardValue_Budget.Text) <= 1000000

```

Form-Level Validation

Before allowing form submission, validate all fields together. Set the DisplayMode property of the Submit button to check all validation rules.

```

If(

IsBlank(DataCardValue_Title.Text) ||

IsBlank(DataCardValue_Department.Selected) ||

!IsMatch(DataCardValue_Email.Text, Match.Email),

DisplayMode.Disabled,

DisplayMode.Edit

)

```

Error Messages

Display clear error messages when validation fails. Add label controls below each field that show error text when the field is invalid and are hidden when the field is valid.

```

// Error label Visible property

!IsBlank(DataCardValue_Email.Text) && !IsMatch(DataCardValue_Email.Text, Match.Email)

// Error label Text

"Please enter a valid email address"

```

---

Cascading Dropdowns

Implementing Dependent Dropdowns

Cascading dropdowns filter the options in one dropdown based on the selection in another. This is common for Category then Subcategory, Country then City, and Department then Team relationships.

Setup:

  • Create a lookup list in SharePoint with columns for the parent value and child value
  • In the Power Apps form, set the Items property of the child dropdown to filter the lookup list based on the parent selection

```

// Child dropdown Items property

Filter(

SubcategoryLookup,

ParentCategory = DataCardValue_Category.Selected.Value

)

```

Multi-Level Cascading

Extend the pattern to three or more levels. Each dropdown filters based on all previous selections.

```

// Region dropdown (Level 1): All regions

Distinct(LocationLookup, Region)

// Country dropdown (Level 2): Countries in selected region

Filter(LocationLookup, Region = DataCardValue_Region.Selected.Value)

// City dropdown (Level 3): Cities in selected country within selected region

Filter(LocationLookup,

Region = DataCardValue_Region.Selected.Value &&

Country = DataCardValue_Country.Selected.Value)

```

---

People Pickers and Lookups

Enhanced People Picker

The default people picker works for basic user selection. For advanced scenarios, use the Office 365 Users connector to search users with filters.

```

// Search users by department

Office365Users.SearchUser({searchTerm: TextInput_Search.Text, top: 10})

```

Lookup Fields with Search

For lookup columns with many values, replace the default dropdown with a searchable combo box. Set the combo box Items property to the lookup list and enable search.

---

Attachments

File Upload Control

Power Apps forms support file attachments through the Attachments data card. Customize the attachment control to set maximum file size, restrict file types (accept only PDF, DOCX, XLSX), display existing attachments in view and edit modes, and allow multiple file uploads.

---

Mobile-Responsive Design

Responsive Layouts

Power Apps forms render on desktop and mobile devices. Design for mobile by using single-column layouts that stack on small screens, setting minimum touch target sizes of 44 by 44 pixels, using scrollable containers for long forms, and testing on actual mobile devices.

Mobile-Specific Features

Leverage mobile capabilities in forms. Use the camera control for photo capture in inspection forms. Use the barcode scanner for inventory forms. Use GPS location capture for field service forms.

---

Performance Optimization

Reduce Data Calls

Minimize the number of data source queries in your form. Load lookup data once using a collection variable rather than querying the data source for each dropdown. Use delegation-friendly formulas for large data sets. Cache frequently accessed data.

```

// Load lookup data into a collection on form load

ClearCollect(colDepartments, DepartmentLookup);

ClearCollect(colCategories, CategoryLookup);

```

Minimize Controls

Every control on the form adds to render time. Remove unnecessary labels, combine related fields where possible, and use gallery controls for repeating sections instead of duplicating controls.

---

Frequently Asked Questions

Can I revert to the default SharePoint form?

Yes. In the list settings, go to Form settings and select Use the default SharePoint form. The custom Power Apps form is preserved and can be re-enabled later.

Do custom forms work in Teams?

Yes. When a SharePoint list is added as a tab in Teams, the custom Power Apps form appears when users create or edit items.

Can multiple forms exist for one list?

Power Apps supports one custom form per list. To show different field layouts for different scenarios, use conditional visibility within the single form based on item properties or user roles.

---

For help building custom SharePoint forms with Power Apps, [contact our development team](/contact) for a forms assessment. We build enterprise-grade forms for organizations where [data quality and user experience](/services) drive operational efficiency.

Advanced Form Patterns

Multi-Step Wizard Forms

For complex data collection, create multi-step wizard forms that break the process into logical stages. Use a variable to track the current step and show or hide sections accordingly. Add a progress indicator at the top showing the current step number and total steps. Include Next and Previous buttons for navigation between steps. Validate each step before allowing progression to the next.

Integration with External Data Sources

Power Apps forms can pull data from sources beyond SharePoint. Connect to Dataverse for master data, SQL Server for legacy databases, REST APIs for external services, and Excel files for reference data. This enables forms that validate user input against external records, auto-populate fields from master data, and submit data to multiple destinations simultaneously.

Offline-Capable Forms

For field workers who need to submit data without internet connectivity, configure Power Apps forms for offline operation. Enable offline mode in the app settings, cache reference data using collections, store submitted forms locally, and sync when connectivity is restored. This pattern is essential for construction, utilities, and field service scenarios.

Form Analytics and Optimization

Track form completion rates and identify abandonment points. Use Power Automate to log form start events, step completion events, and submission events to a SharePoint list. Analyze this data to identify steps where users abandon the form, fields that take the longest to complete, validation errors that occur most frequently, and form completion times by user role.

Share this article:

Written by Errin O'Connor

Founder, CEO & Chief AI Architect | Microsoft Press Bestselling Author | 25+ Years Microsoft Ecosystem

Errin O'Connor is a Microsoft Press bestselling author of 4 books covering SharePoint, Power BI, Azure, and large-scale migrations. He leads our SharePoint consulting practice with expertise spanning 500+ enterprise migrations and compliance implementations across HIPAA, SOC 2, and FedRAMP environments.

Need Expert Help?

Our SharePoint consultants are ready to help you implement these strategies in your organization.