When to use a Field Customizer

Using a Field Customizer is a great way to add functionality to your SharePoint views. This post describes when to use them. It also shows an example of a more complex field customer we created for a policy manual.

In many instances, field customizers will allow you to create complex business applications using the native power of SharePoint lists/views. One of the reasons we prefer SharePoint is the simplicity and power of lists. Lists allow us to store data in a way that is as easy to understand as an Excel spreadsheet. Then we can display that data in a web page — doing things like filtering, sorting, grouping, and paging.

What if you want to add some special formatting or behavior to the column in a view? First, I recommend you try using column formatting or view formatting. You can even include some basic conditional statements in column and view formatting. See this example. If column or view formatting meets your needs, it is preferred because it is easier and does not require deploying an app to your app catalog. However, if you need more business logic than simple formatting can provide, then field customizers might be something to consider. Here is a decision matrix for your consideration:

Column or View FormattingField Customizer
Formatting/behavior can be captured in a declarative JSON objectFormatting/behavior requires JavaScript code
Used on a single siteUsed on one or more sites
Skills needed: CSS, HTML, JSONSkills needed: JavaScript, SPFx
Permissions needed: site editorPermissions needed: site collection administrator for site app catalog, or tenant admin for tenant app catalog
Fast executionCan cause the view to render more slowly
Create Link? YesCreate Link? Yes
Open popup? NoOpen popup? Yes
Start a MS Flow? NoStart a MS Flow? Yes
Use React, Angular, Bootstrap? NoUse React, Angular, Bootstrap? Yes

Here is an example of a field customizer that we created to open a popup that shows additional information for the list item and associated data:

This web part shows some of the power of field customizers.

  • Shows a button in the view labeled “More Info”
  • Opens a popup when the button is clicked
  • In the popup, allows users to do the following
    • View data from the list, but not in the current view
    • View data from a different list (hovering over ‘Performed By’ gets acronym definitions from a separate list)
    • Add/remove the item from favorites (this adds or removes a list item from a different “Favorites” list)
    • Links to associated tools (again, getting data from another list)
%d bloggers like this:
search previous next tag category expand menu location phone mail time cart zoom edit close