How Can I Customize List Forms in SharePoint Online?
The other day, a client asked me a pretty classic set of questions about customizing SharePoint Online list forms. As with some other arenas of endeavor in Office 365, there is more than one way of doing things and it can be confusing.
I am looking at options to customize List forms on sites in SPO and I am trying not to have to deal with code.
My first choice has been InfoPath Designer but I know this is being deprecated and it seems like some of my sites are not allowing the use of InfoPath to customize my forms. [This was an internal issue, not an InfoPath issue.]
I know I could add web parts to the form pages and use JavaScript / jQuery or I could try and edit in [SharePoint] Designer but without the design view I am hesitant to mess around there too much.
Do you have any other tools you recommend for customizing List Forms?
Here’s an expanded version of the answer I gave my client, which incorporates some additional ideas and feedback I gleaned from Dan Holme (@DanHolme) and Chris McNulty (@cmcnulty2000) at Microsoft. (It’s nice being in Redmond for MVP Summit this week, where I can easily catch these guys in the hallway!)
The answer is the classic “it depends”. The main thing it depends on is what type of customization you actually want to do. There are a number of approaches and each has its pros and cons.
Adding JavaScript to the out-of-the-box forms
This is still possible, but I would discourage it in many cases, even though this has been my bread and butter approach for years. The out-of-the-box forms are changing, and “script injection” to do DOM manipulation is less safe. Remember you’re working on a service now, and it can change anytime.
Unfortunately, this means that getting things like cascading dropdowns into forms is becoming harder than it used to be with SPServices. It’s not that you shouldn’t use that approach, but it does mean that the clock is ticking on how long it will continue to work. At lthis point. I’m recommending building entirely bespoke custom forms rather than adding JavaScript to the existing forms, though I still do plenty of the latter.
InfoPath
Yes, it’s deprecated or retired or whatever, but Microsoft will support InfoPath through 2026 at this point. InfoPath is often overkill – you can do a lot with list settings – but at the same time, it can still be useful. Keep in mind that using InfoPath means you’ll need to stick with the classic view for the list or library.
PowerApps + Flow
These new kids on the block are the successors to InfoPath, as announced at Microsoft Ignite. They can do a lot, but they may or may not meet your needs at this point. They did reach GA recently.
PowerApps would be how you would build the forms themselves and with Flow you can add automation – what we’ve called workflow in the past.
PowerApps embedding is “coming soon”. This will allow us to embed PowerApps into the list form context, as shown in the screenshot below. This will be a GREAT thing for a lot of list scenarios. At that point, I think the need for InfoPath will be greatly diminished.
SharePoint Framework (SPFx)
The SharePoint Framework is the next gen development model for things like custom Web Parts, which will run client side. We can build pretty much anything you want with this, but it’s still in preview. At some point in the not-too-distant future, I think we’ll be building a lot of custom forms using SPFx.
Fully custom forms
To create fully custom forms today, you might use development frameworks like AngularJS or KnockoutJS (to name only a few). This can be the right answer, with the goal being to build in a way that can eventually merge into SPFx and the new “modern” pages. Knowing a bit about SPFx is a *very* good idea if you are going to go this route today. You’ll want to build your custom forms in such a way that you aren’t locking yourself out of wrapping them up into the SPFX for improved packaging and deployment down the road.
Third party tools
Because of how I roll, I haven’t used any of the third party tools out there, but there are many. The ones I hear come up most often are Nintex Forms, K2 Appit, and Stratus Forms. Obviously, there’s a economic investment with these choices, as well as a learning curve, so it’s always “your mileage may vary”.
The landscape here continues to change, so keep your eyes and ears open for more news from Microsoft and bloggers like me in the future!
Hi Mark,
As an option I’d recommend to consider Plumsail Forms Designer:
http://spform.com/
It supports Office 365 and allows you to create rich forms deeply integrated into SharePoint. It works the same way as SharePoint Designer — generates a new aspx page with DataFormWebPart but provides really user-friendly UI supporting drag-n-drop, tab controls, accordions, complex tables.
In our forum we recommend using it in conjunction with SPServices.
Hi Mark,
http://www.markrackley.net/2013/08/29/easy-custom-layouts-for-default-sharepoint-forms/
This is also another good option if you just want to customize the UI of the forms. Here you just use OOTB forms and just create custom html code for the layout you need. I have used it multiple times and it works greatly with almost all OOTB field controls.
HI, UNNIkannan,
can you elaborate and help me how to achieve using stratus forms?
@samolpp:
Here’s a link to the Stratus Forms site.
M.
I am currently working on the same requirements, and I can tell you the SharePoint Framework or fully custom forms don’t fit the “I am trying not to have to deal with code” bill.
@Christophe:
No, they certainly don’t. If anything, we’re moving into a period of *more* code, at least until PowerApps grows up and can do a heck of a lot more than it does today. Even then, I don’t know that it will be an”end user tool”, any more than Infopath is.
M.
Hi Mark,
Thank you for posting this. I would appreciate if you take a look at PDF Share Forms as an addition to your list of 3rd party alternative to InfoPath.(https://goo.gl/ZqOxNK ) It is an award winning forms solution for SharePoint (Best SharePoint app 2014 and best intranet/extranet solution 2013). It integrates SharePoint and PDF forms technologies. The main idea is that PDF Share Forms empowers users to be in charge of their forms by implementing PDF form integration, bi-directional data synchronization between SharePoint document library columns and fields of the form, that allows automatic data extraction. It support has workflow action and digital signature support, use of external data sources and many other business critical features.
Full disclosure – I work for the company.
Pavel
Marc,
Can you elaborate on what you mean in this statement: “I’m recommending building entirely bespoke custom forms rather than adding JavaScript to the existing forms, though I still do plenty of the latter?”
I have been loading JavaScript template overrides to handle all my customizations in a locked down tenant (no custom apps). It seems to me that all of the OTB options in the article are probably a year or more down the road before they can fulfill the requirements we develop with current OTB features, JS, and SPServices.
When you say that you don’t recommend “script injection,” does that include using CSOM/JSOM? Given my current environment, I would be left with PowerApps, or, InfoPath (READ: ICK!), to make forms/views. Then there is Flow which appears to be missing some actions that I’m accustomed to in SPD Workflows. The problem is that if these tools don’t allow for some custom code then I simply can’t be successful in delivery quality solutions while leaning OTB as directed by management.
Your thoughts?
@Robert:
As with most things, you should make decisions based on your requirements and environment. However, in SharePoint Online today, things are in a state of flux. Microsoft is automatically flipping many lists and libraries to “modern” and there is currently no way to “inject JavaScript” into those forms. Microsoft actually sees this JavaScript injection as a bad thing, as it can lead to them being blamed for the platform not working as intended. Those of us who have been doing it for a decade now see it as a great way to augment the out of the box functionality in a pretty safe way. If it breaks, we usually can fix it pretty quickly.
Script injection is script injection. It doesn’t matter which API you call, if you push JavaScript into one of the pages, you’re injecting JavaScript. If you are taking over a part of the page that SharePoint doesn’t use, perhaps by adding a “client side web part”, meaning something that doesn’t rely on any of the existing SharePoint DOM, then you’re doing something Microsoft considers more acceptable. After all, this is effectively what the SharePoint Framework (SPFx) is doing.
So, my statements should perhaps be more nuanced, but I want people to understand that they should tread carefully in SharePoint Online. If you’re on premises, you have far more control over your own destiny and may not run into these sorts of issues.
M.
Hi Marc
Thanks for this very clear post. I have been using InfoPath for years, creating tens of complex forms, for my company. Mostly, I was using dropdown lists linked to SharePoint lists (even cascading lists like “give me the modules of this product”), rules to make fields appear or disappear, or become disabled or enabled, rules to make fields interact, rules based on webservices calls for knowing if a user has the right to see some field, or to edit its content, etc.
I have been studying various alternatives, but it looks like I simply can’t find a solution other than third party tools if I want to avoid exploding my development costs. Which is really a pity. Creating forms applications Inside SharePoint was such an easy thing that I really have created tens of them. I could even delegate some customization to some of my users !
I have tried doing a few tests using JavaScript : editing three forms, using js and html code, where I had to just customize one form with no code, is definitely not a solution. My company may go to other environments than the SharePoint one for this reason. This is really a pity.
When I read that according to MS, InfoPath is supported on SP Online “until further notice”, though the option is still available in the ribbon for customizing list forms, I just can’t believe it.
https://blogs.office.com/2014/01/31/update-on-infopath-and-sharepoint-forms/
@Emmanuel:
The post you refer to about Infopath is an older one. Infopath will be “supported” through 2026. If you’re on premises and control your software rollouts, it could be even longer.
I would feel comfortable using Infopath until something better comes along. The party line is that it will be PowerApps and Flow, though they are not there yet.
M.
Hi Marc
You’re right regarding on premise environments. But about O365, I met MS people about two weeks ago, and they told me again that on SP Online InfoPath is supported “until further notice”, as said in the article I mentionned.
So I asked MS (other contacts) for precisions about this part of their roadmap, and got answer yet.
Power Apps and Flow are far from doing what we used to do with InfoPath and SP workflows.
So if moreover we can’t customize forms anymore when using modern UI, what can we do ?
Therefore I completely agree with Robert : if I can’t use InfoPath nor even JS customization anymore in SP Online, it simply means I am not able to deliver quality solutions anymore for forms/workflows processes with this Platform.
I use SP Online mainly for external sharing, this is why I would like to move to this Platform, at least for part of my developments.
Do you know some reference articles about modern UI that explain what we can still do or what we can’t do anymore with it ?
Thank you
Emmanuel
In complement, in this article (updated last friday) : https://msdn.microsoft.com/en-us/pnp_articles/modern-experience-customizations-customize-lists-and-libraries
MS says “Important: We’re not deprecating the “classic” experience, both “classic” and “modern” will coexist.”
If this is a definitive thing, then at least it leaves us time to continue working with classic UI and JavaScript customization until the new solutions are ready.Looking at the modern UI possibilities right now, I think there are far too much things that are missing (look at the article above). So MS needs time to make things better, as I need time to prepare my technology changes.
This requires that we keep having the choice of moving to modern UI or keeping the classic one.
Testing PowerApps as of now, I realize that they still don’t support managed metadata fields (among other things) and the rendering is much worse than the “modern” rendering, at least on a cell phone. Without MMD, I have a hard time imagining how PowerApps can be ready for real usage that requires choices…
In the PowerApps + Flow section is that a real screenshot of something someone has created – if so is there instructions on how to do so please? Or is someone tricking me with photoshop?
@Lisa:
That was an early screenshot (probably mock up) from Microsoft. However, PowerApps have progressed greatly since I wrote this post. With Ignite coming up at the end of the month, expect some big announcements around using PowerApps in the context of SharePoint lists and libraries!
M.
Thanks for the ideas. Would those tools be necessary to add descriptions next columns in a New item FORM? the boss wants an elaborate description to the right of multiple choice column. Thank you
@Steve:
You can add a description to the column settings an it will show below the column field in the forms. There are other ways to get text into the form, but that’s the easiest.
M.
Hi Marc,
I just wanted to add Sintel Forms to this list, I hope don’t mind.
Free to up to 2 forms.
https://sintel.ie/project/sintel-forms/