Form Elements

This topic lists the elements that can be added to a form in a Web page or in a Capture OnTheGo template and explains how to add them to a Form, set a default value or change their validation. For more information about Forms, see Forms.

For more information about elements in Forms, see http://www.w3schools.com/html/html_forms.asp.

Fieldset

A fieldset is a group of related elements in a form. The elements don't have to be of the same type. After inserting and selecting the Fieldset (see Selecting an element) you can add elements to it in the same way you add elements to a Form; see Adding elements to a Form.

Text

The Text element is a simple <input> element with the type text. It accepts any alphanumerical characters, including special characters. The string is HTML-encoded before it is submitted to the server.

Email

The Email element is a text input field that accepts only email addresses in a valid format.

URL

The URL element is a text input field that accepts only URLs (a web page address) in a valid format.

Password

The Password element is a password field that accepts any alphanumerical characters. When the user types in this field, characters are shown as asterisks only.

Number

The Number element is a text field accepting only numbers.

Date

The Date element is a text field accepting only dates in a valid format.

Text area

The Text area element is a text field accepting multiple paragraphs. You can set a number of rows when adding the Text Area to the Form, and change it on the Attributes pane.

Hidden field

A hidden field can contain specific data used by the server-side script. It is not visible to the user. When adding a Hidden Field you can set the value that will be sent on submit.

Label

A Label element is a text displaying informative text within the form. Labels are non-interactive.
Note that this type of label is not tied to an input element. At the same time you add an input element, you can add a label to that element; see Adding elements to a Form. To change a label after inserting the Form, simply click it and start typing.

Checkbox

A Checkbox element sends information to the server whether it is checked (true) or not (false). When adding a Checkbox you can set its initial state and its value. The contents of the value property do not appear in the user interface. If a Checkbox is in checked state when the form is submitted, the name of the checkbox is sent along with its value.

If a Checkbox is not checked, no information is sent when the form is submitted. Fortunately, there is a workaround to submit the status of an unchecked checkbox; see Getting the status of unchecked checkboxes and radio buttons.

Radio Button Group

A Radio Button Group is not an input element itself. Rather it is a group of Radio Buttons that have the same submit name, indicating that they belong to the same group. Multiple Radio Buttons in the same group only accept one option to be selected. Only the value of the selected Radio Button will be sent to the server on submitting the form. If more options are to be allowed at the same time you should use Checkboxes instead.
The option to add a Radio Button Group is only available in the Form Wizard; see Forms. You could also create a Radio Button Group by specifying the same submit name for a number of Radio Buttons when adding them to a Form.

Radio Button

A radio button sends information to the server whether it is selected (true) or not (false). When adding a Radio Button you can set its initial state and its value. The contents of the value property do not appear in the user interface. If a Radio Button is in selected state when the form is submitted, the name of the Radio Button is sent along with its value.

If a Radio Button is not checked, no information is sent when the form is submitted. Fortunately, there is a workaround to submit the status of the unchecked radio button, see Using Form Elements.

The submit name of a Radio Button indicates to which Radio Button Group the Radio Button belongs.

Select

A Select element is a drop-down list with multiple entries from which the user can select only one option. When adding a Select to a Form you can type the options to be given in the drop-down list and the values related to them. Only the value of the selected option will be sent to the server on submitting the form.

To learn how to dynamically add options to a Select element, see this how-to: to Dynamically add options to a dropdown.

Button

The Button element is an element that can be clicked. When adding a Button to a Form you can set the button's type:

  • A submit button will validate the form data and if validation is successful, send the data to the provided URL (by the Action specified for the Form; see Changing a Form's properties).
  • A reset button will reset the form to its original configuration, erasing any information entered and options provided. Note: This cannot be undone!
The button's type can also be changed on the Attributes pane.

There may be multiple submit buttons on a Form. If this is the case, specify a different name and/or value for each of the buttons.

Note: When adding a Button to a Form, you can specify a value, but no name. The Button's ID will be copied to the element's name attribute. However, after inserting the Button you can change its name on the Attributes pane.

  
  • Last Topic Update: 10:41 AM Jun-08-2017
  • Last Published: 2019-05-22 : 2:52 PM