Radio group

Standard HTML input radio 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 radio group 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 radio group.

  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
• Additional Attributes:
  JavaScript: onclick="your_function();" - this will trigger a JavaScript function when a radio 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 select the radio groups, and its value will not be submitted.

19 persons found this article helpful.

You Should Also Read