Column Formatting SharePoint: Severity Levels

The Microsoft website has a detailed description on how to Use column formatting to customize SharePoint.  In particular, it shows how to apply formatting based on the value in a field using a CSS class.  Unfortunately, the article does not list the severity levels available.  A little poking around at the style sheets uncovers the following severity codes:

  • sp-field-severity–good
  • sp-field-severity–low
  • sp-field-severity–warning
  • sp-field-severity–severeWarning
  • sp-field-severity–blocked

Also of note, the example code for that section does not properly reflect the necessary code to reproduce the example.

Status field with done colored green, blocked colored red, and in review colored orange

"class": "=if(@currentField == 'Done', 'sp-field-severity--good', if(@currentField == 'In progress', 'sp-field-severity--low' ,if(@currentField == 'In review','sp-field-severity--warning', if(@currentField == 'Blocked','sp-field-severity--blocked', ''))"

If you read the JSON, the example overlooks the Has Issues condition.  The JSON should actually read:

"class": "=if(@currentField == 'Done', 'sp-field-severity--good', if(@currentField == 'In progress', 'sp-field-severity--low' ,if(@currentField == 'In review','sp-field-severity--warning',  if(@currentField == 'Has issues','sp-field-severity--severeWarning', if(@currentField == 'Blocked','sp-field-severity--blocked', ''))"

As well, the icon section leaves out Blocked. It should be:

"iconName": "=if(@currentField == 'Done','CheckMark', if(@currentField == 'In progress', 'Forward', if(@currentField == 'In review', 'Error', if(@currentField == 'Has issues','Warning', if(@currentField == 'Blocked','ErrorBadge','')"

Leave a Reply

Your email address will not be published. Required fields are marked *

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