Customize List Forms – PowerApps Easy Button

There is a brand new, super easy way of customizing SharePoint Online list forms now, replacing the way that we used to do it in InfoPath.  Now, not only can we quickly customize a list form in the browser using PowerApps, but once we do that, that customized form becomes the default form on the list!  So, when end users add, edit, or view items right in the list, they are automatically using the customized form!! HUGE.  For all of those of you out there who were waiting for this, waiting for PowerApps to be more integrated into your lists, well it has arrived!

First of all, here’s how to do it.  This only exists in the modern look, so if your list is still classic, you won’t see this.  Also, as of right now, it’s still rolling out, so some tenants don’t have it yet.

When you click PowerApps, and  Customize forms (see above screenshot), it takes you to PowerApps.  This is a different kind of PowerApp than you get when you click Create an App.  When you customize a list form, it isn’t going to be an app that will show in your list of apps, or on your phone.  But, when you use the SharePoint mobile app, and go to your list to fill out a form, it *will* be this custom PowerApp form.

*To make it visible to end users, click File -> Save, then Publish to SharePoint.  You can click Back to SharePoint at the top left, to go back out of PowerApps, to your list.

Also, when you go to your list settings, and Form settings, that’s where you can switch back to the default SharePoint form and/or delete your customized form if you change your mind.

Once you are in your new form in PowerApps, here are a couple of things to notice.  On the left, click SharePoint Integration, and on the right, click Advanced.

By default, your app will only have one screen.  These settings above are where you can determine what happens when the form is edited, created, or opened from the SharePoint list.  During SharePoint Power Hour this week, I did a demo of this, and showed my recommended actions to add to the defaults, and the reasons.

In my demo, I created a different screen and an EditForm, and re-configured the advanced settings.

Another very common thing, is to make the form a bit bigger, so that it takes up more of the page, which is great for forms that have a lot of fields.  Here is what the form looks like by default:

To make it wider, in your PowerApp, click File -> App Settings

For Screen size & orientation, orientation, choose Landscape.  Once you have more area to work with in your app, you can set up your form to have multiple columns, and just have more room to work.

There are a few other things to notice and be aware of with these SharePoint-integrated forms.  When you click to select a form control, when you look at the properties, you’ll see that there are a bunch of built in settings for things like the form mode and the Item property.  I recommend that you not remove those settings, because these are related to the correct item opening up when it’s selected in the SharePoint list.

Here is my hour long video demo of customizing a list form with PowerApps:

To learn all about PowerApps, check out my PowerApps courses.

29 comments

  • But what about all of us SharePoint 2016 On-Site users? When do we get these cool tools to use?

    Like

  • Laura you wrote “But, when you use the SharePoint mobile app, and go to your list to fill out a form, it *will* be this custom PowerApp form.” I customized a form and it works as expected on the desktop, but when I view it with my iPhone using the SharePoint Mobile App, its the original form. Perhaps this is yet to be changed?

    Like

  • Hey Laura, I repeated editing the form in PowerApps…file/save…Publish to SharePoint. Same issue. The custom form is working from the SP list using a desktop browser but has not impacted the SharePoint Mobile App. I even uninstalled the mobile and and reinstalled in case there is some caching issue. Seems to be the same issue on iPad and iPod SP mobile apps. I’ve opened a support ticket with MS.

    Like

  • Thank you for your videos. Very helpful. I went the route of using PowerApps forms and was pretty happy with the look. I am really disappointed though that you can not add attachments as this defeats the whole reason for my sharepoint lists.

    Have you posted anything about how to make hyperlinks work in the PowerApps forms? I have a child data table which I know users are going to want to export to excel. I imagine that I will need to make a hyperlink that takes them to the underlying list items so they can use the export to excel functionality.

    Like

  • Pingback: PowerApps Tabbed SharePoint Form | @WonderLaura

  • Peter Varberg Madsen

    Hi Laura

    Thank you for some great posts and videos. Very relevant to my current work. 🙂
    I did a list with custom PowerApps forms for next-of-kin inspired by your blogpost. But I only kept the default Save button above the form and use that for submitting both the new and edit form.
    To make this work I create a variable called “ActiveForm” that is set when the form is loaded and then I use this to find out which form to submit OnSave.
    OnNew: NewForm(FormNew);;Navigate(FormScreenNew; ScreenTransition.Cover);;Set(ActiveForm;”new”)
    OnSave: If(ActiveForm=”new”;SubmitForm(FormNew);SubmitForm(FormEdit))

    It works, but I’m not sure that this is the correct way to achieve the goal.
    Do you have any other suggestions?

    Kind regards
    Peter Varberg, Denmark

    Like

  • I’ve made a small customisation to a modern UI form using PowerApps – but it appears that this customised modern form can now only be used by users with a PowerApps license. Does anybody know if that’s the case? We hadn’t planned on giving everyone a PowerApps license, only power users, but that won’t be possible if you need a PowerApps license just to fill out a cusotmised modern list form.

    Like

  • Thank you for diving into these new PowerApp custom forms. Very helpful!

    Like

  • I have the same issue as rolly – the Sharepoint App on iOS does not use the customized form.

    Did you get any information from Microsoft on this?

    Like

  • Hey Laura,

    Thank you for #SharePointPowerHour! it is a great webinar. I’m working on using PowerApps to create custom SP list forms, but one thing I noticed while I was building it is that if I go back to the list, add additional columns, the new columns do NOT get pulled into the PowerApp via the data connection. I’ve tried using “Refresh”, along with closing out of the PowerApp Web Designer, and reopening from the SP List. Any ideas?

    Like

  • Hello Laura

    I customized a list form with powerapps, however, I can no longer upload new attachments. I can see the files I uploaded before the customization, but I cannot upload new ones. Any Idea?

    Regards

    Like

  • It seems not all browsers are compatible for customization. Surprisingly, IE 11 does not open the form in PowerApps (after I click on Customize in the modern view) but Firefox 57 and Chrome 63 does. Any insight on it?

    Like

  • Is there any chance we can find the person who invented this monstrosity called “PowerApps” and have them publicly flogged? InfoPath and Access web apps were so much better. PowerApps is NOT something your “Pointy Haired Boss” can use as advertised. It’s a horrible tool.

    Like

  • Hi Nice post, anyone can help, how I deploy the same power app customize form in different environment. I created the form in dev, Now I want to move in test and prod environment, Let me know I can I achieve this

    Like

  • Just want to say that your recommendations for actions to add to the defaults of the Sharepoint Integration was extremely helpful!

    Like

  • How Can i make Repeating section on form ??

    Like

  • Hi there Laura,

    Thanks for this fantastic information. However, I am having some real difficulty with the “On Save” formula for the SharePointIntegration menu.

    I have 3 forms(new, view, edit). Currently my new form has less fields than the view and edit. I can currently save a new form using the Submitform(FormNew) command but when I select the Save button while in the edit form nothing happens. it seems like only the new form can be submitted. I went online and found a post from Microsoft recommending the following formula: OnSave – If(SharePointFormMode=”CreateForm”, SubmitForm(CreateItemForm), If(SharePointFormMode=”EditForm”, SubmitForm(EditItemForm)))

    I tried this and it always says that it contains invalid arguments. Any thoughts on how I can correct this issue?

    Thank you in advance.

    Like

  • No worries, I was able to finally figure it out. I had to set the sharePointFromMode variables all up before the OnSave command would function properly.

    Like

  • This webinar is great but it should come with a warning that the modern page list view opens the standard sharepoint form. THis is a killer as I have a list that I was using the list view webpart to show requests at various stages of a process, thats fine but now I can’t use the list webpart as it just provides the standard single column form with 40 odd fields rather than the form customised in powerapps.

    Is there a way to get the new and edit forms from the list view webpart to utilise the custom form?

    Like

    • I just added a modern list web part to a modern page, and added a classic list web part to a classic page. When I clicked the “new” button in each of those, it did automatically open up to my customized PowerApps list form.

      Like

  • Thanks for your informative videos. I am having an issue dragging/dropping the fields to reorder them on the form. I have deselected “Snap to Forms”. I get a cross hatch when I select the data card but it won’t move. I also tried moving the fields in the “Fields” list in the Properties, but they won’t move. I can resize the fields, but I can’t move them. Have you ever experienced this before? If so, I’d be interested in some tips — everything else works great, but this extremely limits my ability to use this tool to create better forms for my users.

    Like

Leave a reply or question

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.