Recurring Form Component Elements: Constraints
in Common Forms

Element that is used in Form components to add a behaviour or display restriction or change to a component

  • Mandatory Expression
  • Visibility Expression
  • Access Expression
  • Value Commit Script
  • Positive Reinforcement

Recurring Form content elements are elements that occur in multiple components with more or less similar functions and display. The elements are: Constraints and Style.

Constraints are used to add a behaviour or display restriction or change to a component.

on this page:
Occurrence of Constraints , Opens In New Window Expressions , Opens In New Window
Mandatory Expression , Opens In New Window
Visibility Expression , Opens In New Window
Access Expression , Opens In New Window
Value Commit Script , Opens In New Window Positive Reinforcement , Opens In New Window
Dialogue settings , Opens In New Window

Introduction

The Constraints Expression elements are used to add a behaviour or display restriction to a component. This means that it can be controlled how a component behaves, depending on the user's input. For example only if a certain condition is met (the value uf a checkbox is set to yes), then a defined action is performed (make a component mandatory). Additionally, by using the Value Commit Script, any kind of action can be defined, that should be triggered upon the user's input. The Expressions are written in JavaScript, but are also easy to use without prior scripting knowledge.

With the Positive Reinforcement, the input method (validation) can be controlled.

 

Glossary:

Example:

Display in Form Reference

To see the feature, please choose Yes.

Display in Modal Overlay

Occurrence of Constraints

The Constraints tab can be found in different composition in the following Form components:

Expressions

With the Constraints Expressions it is possible to influence the appearance or behaviour of a component A, based on the choice made in component B. This means, that for example, a user decides, that he wants to become a customer = YES, then, other fields can either become visible, accessible or mandatory.

The Expression is based on the same strucutre:

So this code snippet, $customer$ == "yes", is then put in an Expressions field of the component that shall be restricted. The Expressions are written in JavaScript and therefore, there are many more possibilities of how to create Constraints with a different behaviour. A few more examples:

Multiple Expressions

Multiple Conditions

Either / Or Condition

Complex Constraints

By combining the && and || operators you can create more complex constraints.

Mandatory Expression

The purpose of the Mandatory Expression is to set a field to mandatory, if a certain condition is met. In the CMS, the input field is only configurable if the Mandatory Type is set to Expression.

Example of use:

Visibility Expression

The purpose of the Visibility Expression is to hide a field until a certain condition is met. Only then the input field is visible / editable by a user.

Example of use:

Access Expression

The purpose of the Access Expression is to have a field inactive / inaccessible until a certain condition is met. Only then the input field is editable by a user.

Example of use:

Value Commit Script

With the Value Commit Script, the value of a field can be changed upon input. This feature can be used to e.g. convert umlauts or set all letters to lower case. The scripts are written in JavaScript, therefore a little scripting knowledge is needed.

Find below some example codes / use cases. If these codes are re-used, simply replace the name-of-component with the actual name of the component.

Examples

 

Convert all letters from lower to upper case:

Convert all letters from upper to lower case:

Convert the first letter to upper case:

Convert umlauts (ä/ö/ü to ae/oe/ue):

Positive Reinforcement

The Positive Reinforcement defines at which point the validation of an input shall be performed. If the checkbox is checked, the validation happens as soon as the user starts the input. If the checkbox is unchecked, the validation is performed upon clicking the submit button.

It is recommended to turn on the Positive Reinforcement because it is more user friendly to point out a wrong input right away, so the user can correct it and move to the next field.

Dialogue settings

The Constraints tab is available in most Common Forms components, see a list in the Occurrence of Constraints section.

tab: Constraints

In this example, a Date component with a set Mandatory Expression and a checked Positive Reinforcement is displayed.

Related topics