Components - Checkbox group

Standard HTML checkbox. This component allows the user to define more checkboxes grouped together. The properties that this component supports are:

  • Name: the name of the component. Please remember that this property must a have a non-empty and unique value within a form.
  • Caption: the caption associated with this component.
  • Items: this property specifies the checkboxes that will be visible . There are a number of ways you can specify checkboxes.

1. Simple: just type in the names of the checkboxes , separated by newlines (i.e. hit `Enter'), like this.

Example:
name 1
name 2
and so on

If you want that a certain option is selected by default, just add [c] (stands for `checked') at the end of the desired checkbox name, like this:

Example:
name 1
name 2[c] //this checkbox will be checked by default
and so on

If you want more than one checkboxes checked, do this

Example:
name 1
name 2[c] //checked by default
name 3[c] //checked by default
option 4
option 5[c] //checked by default

2. Advanced (!): suppose that you want that the checkbox displays some values, but when the user submits the form, other values should be returned. In order to do this, use the pipe ( ) character. The value left of the pipe is the returned value, whilst the value right of the pipe is the value displayed by the checkbox in the front-end.

Example:
value 1|name 1
value 2|name 2
value 3|name 3

For checkboxes that should be checked by default, use the same rule as above

Example:
value 1|name 1[c]
value 2|name 2[c]
value 3|name 3


  • Flow: whether the checkboxes should be presented in a vertical or horizontal fashion.
  • Required: this property specifies that the current component must have a value, otherwise the form will not be submitted. In other words, it means that at least one checkbox must be checked in order that the checkbox group is valid.
  • Additional Attributes(!): using this property you can set custom attributes inside the HTML tag. The most common use for this property is adding custom CSS style (using style="some style here") or for further Javascript processing (like onKeyUp="javscriptFunction();"). Naturally, you can add whatever additional attributes you like, taking into account that they must be valid for this component type.
  • Description: the description of the component. This will be displayed in the front end, as a textual help for the user. Use this when the Caption of component is not self-explanatory.
  • ValidationMessage: shown when the Required constraint is not met. In other words, if the user doesn't check any checkbox, this message will be displayed and the form will not be submitted.

Note:
Inside the Items area you can also use custom PHP codes in between the // and // tags. For custom scripting examples please refer to the Custom Scripting section.