Building Forms in SharePoint Online

Introduction – Why would you want to build custom forms in SharePoint Online?

The world of work as we know it has significantly changed over the last few years, as the pandemic rapidly accelerated the digital transformation journeys of many companies. Just recently, the Dubai government announced that it had become the first government in the world to go completely paperless. With more people working remotely, there is a need to enhance business forms and processes with content management systems like SharePoint, including incorporating automated workflows in these forms.

In the past, InfoPath was the application used to design and fill forms until Microsoft announced in 2014 that it was discontinued, and users have since pivoted to the out-of-the-box SharePoint list forms, Microsoft Forms or Power Apps.

SharePoint Lists/Microsoft Lists vs Microsoft Forms vs Power Apps

A SharePoint list is a collection of data in rows and columns, much like an Excel spreadsheet, but with the options to include multiple data types, including persons, choice, metadata, amongst other features like calculated columns. Microsoft Lists are essentially the same as SharePoint lists. Still, they can be described as an evolved version of SharePoint lists that better integrate into the entire Microsoft 365 environment. SharePoint lists come with default out-of-the-box forms that allow users to enter, edit or just view list items. These default forms are rudimentary and are sufficient if only light entry work is needed.

Microsoft Forms is an application within the Microsoft 365 suite that allows users to create surveys, quizzes and polls. It is suitable to gather information and opinions, especially from people outside your organization.

Users can also customize SharePoint list forms with Power Apps without writing code. With the Power Apps studio integration, you can change the arrangement of fields on the form, set conditional formatting such that fields are visible if certain conditions are met. You can even edit the form size itself.

Users looking for a more customized experience would find the Power Apps integration helpful. Other third-party tools like Lightning Forms provide much stronger customization features, and we will be discussing the Lightning Forms features later in this article.

Getting Started with SharePoint List Forms

Customizing SharePoint List Forms Out-of-the-Box

Creating Columns

In SharePoint lists, you have multiple data types with which you can create columns. Some of them are Single Line of Text, Multiple Lines of Text, Location, Person, Image, Managed Metadata etc. Another useful type of column is the Calculated Column. As the name suggests, this column contains values calculated based on the information in other columns. You can also reorder the columns by either dragging them to the desired positions or by clicking the column settings and moving them left or right.

Figure 1: Image showing the columns that can be added to a SharePoint list 
Figure 2: Image showing an extended list of SharePoint column types

When you want to create a new list item, a default form is generated based on the columns you add to the list.  

Figure 3: A default SharePoint list form 

In the image above, you have a default new form with two Single Line of Text columns (Title and Food), a Location column and an Attachments column. 

Limitations

The out-of-the-box SharePoint list forms are limited in many ways and scenarios. Some of those scenarios are:

  1. Form Size: You cannot resize the form with a click of a button as you please, and you would have to make do with the way SharePoint natively arranges all the fields in the form.
  2. Dynamic Visibility of Fields: Sometimes, you would want to hide some fields, depending on variables like the SharePoint Group or Active Directory Group that the form user is a member of, or the option chosen in another field. You cannot set this dynamic form visibility with out-of-the-box forms.
  3. Tabs: You may prefer a more concise form with different fields placed in other tabs. You cannot have this arrangement with out-of-the-box forms.
  4. Custom Action Buttons: The default forms do not have the provisions for buttons that allow you to send emails, execute a script, call a Power Automate Flow and so on.
  5. Complex Calculations: While Calculated Columns are available, the native usage is relatively basic.
  6. Cross-Site Lookups: You can look up information on other lists on the site, but you cannot perform lookups across other sites in the environment.

Lightning Forms can handle all of the above limitations and more.

Customizing SharePoint List Forms with Power Apps

How to get started with Power Apps to customize SharePoint List Forms

As we mentioned earlier in the article, users can customize SharePoint list forms with Power Apps without writing code. There is no charge to use Power Apps with the license that comes with your SharePoint subscription (as long as you’re not using premium connectors or features). Some organizations might have Power Apps disabled by default as part of their governance policy, so if a person cannot see the option to customize using Power Apps, that could be why. You can integrate and customize your forms in the Power Apps studio. When you publish the customizations, the customized form can then be worked on by the users in SharePoint.

While the customized Power Apps forms provide more functionality, there are some limitations to their operation. Some of which are:

  1. User Access to Customized Forms: For a guest user to use a customized SharePoint list form, they must have view access to the SharePoint site hosting the custom form. For the guest user to create or edit a customized SharePoint list form, they must have edit access to the SharePoint site hosting the form and have the Environment Maker security role in the Power Platform environment used to customize the SharePoint site. They may also require separate licenses for custom forms that use Premium capabilities. A guest user with a personal account (e.g. Gmail) cannot edit a Power Apps form even if they have the SharePoint and Environment permissions. A work or school account is required. An organization user must have view access to the SharePoint site hosting the custom form and have a Power Apps plan that includes use rights to connect to Microsoft 365. They may also require separate licenses for custom forms that use Premium capabilities. To create or edit a customized SharePoint list form, they must have edit access to the SharePoint site hosting the form and have the Environment Maker security role in the Power Platform environment used to customize the SharePoint site.
  2. Image Columns: Not all column types are supported, and one of note is the image column for users who would need to use images with their lists
  3. Moving Forms: You cannot transfer your forms from one list to another. This could lead to repetitive work where you must customize forms for different lists every time.
  4. Custom Lists: Custom list and library templates are currently not supported. Custom forms for lists are only supported in generic lists and generic document libraries.
  5. Training: For someone with no previous Power Apps experience, customizing a SharePoint list form could be a daunting task as there are many controls to learn. A helpful resource to consult would be Nlightning, a Power Platform coaching service to help you build your business solutions.

Customizing SharePoint List Forms with Lightning Forms

How to get started with Lightning Forms

Lightning Forms is an intuitive SharePoint list form design tool that enables you to improve the logic, layout and styling of your modern, responsive SharePoint Forms. Lightning Forms offers cascading lookups, customized buttons with actions, repeating lists integration, tab controls, styling and conditional control formatting, and simple to use calculations and expressions. These features help you easily build business forms that maintain the modern-looking experience within SharePoint.

It provides you with a fully integrated design interface that enables you to organize fields, tabs, add Rich Text, and build logical actions, all without code. Importantly, your data is stored in your lists and is not processed or stored outside your tenant.

Cascading Lookups, Hide Fields, Field Validation, Cross List Calculations, Actions, and Default values can all be performed easily. Being integrated into SharePoint means that the context of the list and environment variables are handy to help with your calculations.

Lightning Forms also comes with a full 30-day trial within which you can test out all the product features in your environment. You can download it here, and an authorized member of your organization (like an IT admin) can install it in the SharePoint app catalog. You can find installation and training video guides here.

Advantages of using Lightning Forms

  1. Modern or Classic including SharePoint 2016/2019: Using Lightning Forms, you can design and customize your forms, not only for Modern SharePoint lists in SharePoint Online and SharePoint 2019 but also for Classic SharePoint lists in SharePoint 2016.
  2. Contextual Design Experience: With Lightning Forms, you get a design experience for your SharePoint Modern List Forms with the context of the form you are customizing. You can test your logic with existing list items, build expressions using existing fields belonging to the list you are modifying, and test your changes without committing your changes to the list. You can also quickly clear your customizations and revert to the original form. In addition, environment values such as user profiles and site properties can be used and tested within the design experience.
Figure 4: Image depicting the form design experience 
  1. Moving Forms: You can transfer your forms from one list to another. Doing this saves you a lot of time that would otherwise have been spent customizing forms for different lists.
  2. Image Columns: Image columns are supported, unlike with other third-party customization tools.
  3. Custom Lists: Custom lists are supported
  4. Intuitive: With an intuitive expression builder, you can build powerful expressions for calculating field values, hiding fields, configuring the form load experience, and much more without having programming knowledge. Issues with your expressions are explained in the interface and can be tested without exiting from the design experience.
Figure 5: Image showing the Visibility Condition Expression Builder 
  1. Sub lists: Using Lightning Forms, you can embed a list that is on your site, onto the form of another list. An example is an Expense Items list that has been embedded in another list form (Expense Report), as shown in the image below. The Expense Items list is added as a sub-item option as in the picture. When items are added to the Expense Items list on the Expense Report form, those items would also be auto-populated in the original Expense Items list.
  2. You can also set the Expense Items sub-list to be displayed in its complete format on the Expense Report list form.
Figure 6: Image showing the addition of sub lists on a form 
 
  1. Custom Actions: With Lightning Forms, you can build a series of actions such as Save Form, Send Email, Set Form Field Value, Add List Item, Execute a script, Trigger a Power Automate Flow and so on. These actions can be configured against the Forms load event, floating buttons or command bar buttons.

You can drag and drop the required action and follow the simple configuration steps as in the image below.

Figure 7: Image showing some of the available actions in Lightning Forms
  1. Advanced Logic: Lightning Forms provides you with a fully integrated design interface that enables you to organize fields, add Rich Text, and build advanced logical actions without code.
  2. Cross-Site Lookup Columns: The default out-of-the-box SharePoint list forms only allow lookups on other lists in the current site, but not lookups across other sites in the environment. With Lightning Forms, you can perform lookups across other sites.
  3. Tabbed Interface: With Lightning Forms, you can give your forms a distinct custom look by arranging different fields in different tabs. You cannot have this arrangement with out-of-the-box forms.
  4. As in Figure 4 in point (ii.) above, there are two tabs on the Expense Report form – Claimant and Approval. If needed, you can set access conditions on a tab to ensure that only users with the right privileges can access the fields in that tab. You can also set these conditions on the fields directly.
  5. Dynamic Visibility of Fields: You can choose to hide some fields, depending on variables like the permission level of the form user, membership of an active directory group or the option selected in another field.

Summary

Depending on the scenario, you can work on SharePoint lists with the basic default forms or customize them for a better experience. Using a customized form expands the possibilities you can achieve within your business processes, and third-party tools like Lightning Forms go a long way in helping you accomplish your goals.

Leave a comment