Checkbox Group

Standard HTML input checkbox tag with the following configuration tabs:

General

• Name: the name of the form component. This needs to be unique for each form. It can contain only alphanumeric chars. The name of the field is only used for internal reference - it will not be displayed in the front-end area.
• Caption: the caption or label is the text or HTML that is being displayed in the actual form.
• Items: The items of the checkbox should be specified one per line. This too, can incorporate custom scripts in between the code tags.

  The selectable items are composed out of two parts: value and label, separated by the pipeline character (|). For example:
  

  Steve Matt|Steve Matt, marketing director.
  Using this formula, the selection will display Steve Matt, marketing director, but Steve Matt will be stored into the database.

  You can even have an option selected by default, by using the [c] syntax. For example:
  

  Steve Matt|Steve Matt, marketing director[c]

  Or you can choose to disable a particular option, by using the [d] syntax. For example:
  

  Steve Matt|Steve Matt, marketing director[d]

  You can use the placeholder {field_name:text} in the Thank You message or Email messages(the value "field_name" should be replaced with the actual name of the field). The placeholder will return the label of the selection and not the actual value of the checkbox.

  You can also add a link to the item's label similar to: value|label <a href="_your_url_here" target="_blank"> this is a link </a> .

• Description: text/HTML area that provides a description of the field. This can be useful for providing explanations or indications for that particular field.

Validations

• As a validation rule, this can only be set to be Required or not.
• Validation Message: text / HTML area that will allow you to set up a message that will be displayed if the field validation fails.

Attributes

The Attributes area allows you to add JavaScripts triggers, custom style (for that particular field), impose size restrictions, etc. Anything filled in this area, will be added directly to the HTML tag.

• Flow: Horizontal / Vertical / Vertical 2 columns / Vertical 3 columns / Vertical 4 columns / Vertical 6 columns
• Max Selections: Limit the number of selections. Type 0 or leave the field blank for unlimited selections
• Min Selections: Require a minimum amount of selections for this field to be submitted.
• Additional Attributes:
  JavaScript: onclick="your_function();" - this will trigger a JavaScript function when a checkbox will be clicked.
  CSS: style="margin-left:20px" - this will set a 20px margin on the left side.
  Input property: disabled="disabled" - the field will be completely disabled. You will not be able to click the checkboxes, and its value will not be submitted.

43 persons found this article helpful.

You Should Also Read