Lightning Forms – Apply Style – Conditional Formatting

In this video, we explore the styling options in Lightning Forms so that you can apply styles to your SharePoint list forms control. General styles can be styled along with individual styles.

In this video, we explore the conditional styling options that you can apply to your SharePoint List Forms. The conditional formatting is very useful to apply colours or other formatting based on a rule or condition.

Styling can be applied conditionally, which offers a great alternative to field validation. The problem with field validation is that someone can add a great deal of information to a form, and then find that they cannot save it due to one field not meeting the validation criteria. Styling will bring attention to the user that something isn’t as expected, but still allows the form to be saved. For example, if I exceed my expense limit, it’s possible that I may still want to submit the expense claim even though it has exceeded my limit.

To set conditional formatting in your SharePoint Form Design:

  1. Click the Styling button from the command bar
  2. locate the control that you wish to apply the styling to from the Control Styles section.
  3. Add a style to the control by clicking the ellipses next to the control.
  4. Provide a name for your style that is descriptive. e.g. ‘Style when Status is Approved’
  5. Add a condition using the Expression Builder e.g. [[Status]]==”Approved”
  6. Apply the styles such as Field Input to contain a green border.
  7. Optionally, repeat the same condition and style for other controls such as the Status tab.
Note: Conditional Formatting is often more useful on EditForms and DisplayForms when checking the status, since the status would usually always be Null or Pending on the New Form.

Leave a comment