Conditional Styles

Conditional styling allows to show/hide, disable, make required or clear form components conditionally. Conditional styling can be applied to various form components:

  • Data Source object fields
  • Virtual fields 
  • Section/Page
  • Custom Button
  • Blank Space
  • Custom URL
  • Nested Form
  • Static Text
  • File
  • Image
  • Related Lists and Lists

Note: when conditional styles are applied to the Section/Page component, they will be applied to all items inside the section.

Expand or collapse content Generic Conditional Styling

Select component "Section" on the canvas. Click "Add New"  button in the "Conditional Styles" section of the component properties sidebar:

On Conditional Settings popup choose action type and click "Add" button in Conditions:

See details on using conditions at Working with Conditions article.

Conditions are:

  • hide - item will not be displayed
  • show - item will be displayed (and, will be hidden by default when conditions do not matched)
  • disable - item will be displayed in disabled mode
  • clear - item inputs will be cleared
  • required - item will become required to be filled in (available for input items only)

An example below displays Section in case when Account (form data source object) type is set to Installation Partner. Check images below to see how form looks like when account type is set to Installation Partner and when it stores any other value.

Expand or collapse content Dynamic Conditional Styling

Having controlling field(s) displayed on the form allows user to use dynamic styling.

Select component "Nested Form" on the canvas and click "Add New" button at Conditional Styles:

On Conditional Settings popup select action type "Hide" and click "Add" button to configure condition:

See details on using conditions at Working with Conditions article.

Check images below to see how form will look like when user chooses "Hot" rating on the form (1) and when any other value is selected:

Expand or collapse content Turn on/off Conditions on a Form Item

For cases when you need to disable conditional styling without removing styles you have added you can simply turn them off:

You can also turn styles on/off from Conditional Style Settings popup:

0 Comments

Add your comment

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.