This article covers the Form Designer's Fields and their properties.
The Form Designer's left-side panel contains all of the available Form Field types. Each Form Field Type has its own individually configurable properties.
Single Input
A Single Input Form Field is used to collect short text responses. A newly added Single Input field will look like this:
You can specify the type of data to be collected using the drop-down immediately to the right of the 'Single Input' field type - in the screenshot above, the data type is set to 'Email'. The available data types are: Text, Email, URL, Integer, Decimal, Money, and UTM.
A Single Input Form Field set to Email data type (as shown in the screenshot above) is what you must use to collect the form submitter's email address. Click's service will use the email address submitted to a Single Input Email Form Field to match with any existing Lead/Contact records, or to create a new Lead/Contact if no match is found. We strongly recommend including a Single Input Email field mapped to the Lead/Contact email fields in every Form. If you do not include a field to collect the email address, submissions to the Form will either be anonymous or will rely on web tracking data to determine the relevant Lead/Contact record.
Single Input Form Fields have General, Mapper, Layout, Conditions, and Validation field properties, as described here.
When you have set your Single Input Form Field with Data Type = 'Text' you will also be given access to Input Mask Settings and Data properties. In the Input Mask Settings you can specify an input mask type to control the formatting of the submitted data, thus ensuring data accuracy and cleanliness.
Date Time Picker
A Date Time Picker Form Field is used to collect date or date/time values via a date or date/time picker. A newly added Date Time Picker field will look like this:
Date Time Picker Form Fields have the standard General, Mapper, Layout, Conditions, Data, and Validation field properties, as described here.
In the Date Time Picker's General Properties you can choose whether to provide a date picker or a date/time picker.
Country
A Country Form Field is used to collect Country data via a dropdown list of all Countries. A newly added Country field will look like this:
Country Form Fields have the standard General, Mapper, Layout, Conditions, Data, and Validation field properties, as described here.
Consent
A Consent Form Field is used to explicitly collect consent along with the Form submission. A newly added Consent field will look like this:
Each Consent item must be filled with custom text to fit your needs, as required by your Form's specific purpose and context. You can add multiple Content items, all of which must be checked in order for the Form to be submitted.
Consent items can be added, removed, edited, and mapped via the Consent field's Choices properties section. The standard General, Choice Options, Layout, Conditions, Data, and Validation field properties are also available, as described. here.
Phone
A Phone Form Field is used to collect phone numbers. A newly added Phone field will look like this:
When filling out your Form, respondents will be able to select their Country Code from a drop-down and type in their phone number.
Phone Form Fields have the standard General, Mapper, Layout, Conditions, Data, and Validation field properties, as described here.
Comment
A Comment Form Field is used to collect free-form text data. These are great fields to use when you want to elicit longer responses from your respondents. A newly added Comment field will look like this:
While filling out your Form, respondents will be able to type in free text.
The Comment field's Layout properties allows you to set the number of rows in the Comment field so that you can elicit shorter or longer responses, as appropriate for your Form. The Layout properties also contain an option to expand the input field dynamically as respondents add text.
Comment Form Fields have the standard General, Mapper, Layout, Conditions, Data, and Validation field properties, as described here.
Radiogroup
A Radiogroup Form Field presents respondents with a series of options, only one of which can be selected. A newly added Radiogroup field will look like this:
There are a few different methods for adding items to your Radiogroup field:
- Manually add radio items with the '+' icons shown in the screenshot above.
- Manually add radio items in the Choice Options field properties section.
- Copy choices from an existing Form Field in the Choice Options field properties section.
- Select Lead and/or Contact map fields in the Mapper field properties section. This will present you with the option to generate radio items based on the option values of the selected field, if and when the selected field has option values.
- Use the Choices from a Web Service field properties section to pull in radio items from an external URL. You will need to provide the URL, the path to the data, the join identifier, and the GET value to display.
The Layout properties section contains a Column Count property, which can be very helpful for accommodating large lists of radio items. The Choice Options field properties section allows you to individually set the Lead and Contact mapping for each radio item.
Radiogroup Form Fields have the standard General, Mapper, Choice Options, Choices from a Web Service, Layout, Conditions, Data, and Validation field properties, as described here.
List
A List Form Field presents respondents with a drop-down list of options, only one of which can be selected. A newly added List field will look like this:
There are a few different methods for adding items to your List field:
- Manually add list items with the '+' icons shown in the screenshot above.
- Manually add list items in the Choice Options field properties section.
- Copy choices from an existing Form Field in the Choice Options field properties section.
- Select Lead and/or Contact map fields in the Mapper field properties section. This will present you with the option to generate list items based on the option values of the selected field, if and when the selected field has option values.
- Use the Choices from a Web Service field properties section to pull in list items from an external URL. You will need to provide the URL, the path to the data, the join identifier, and the GET value to display.
The Choice Options field properties section allows you to individually set the Lead and Contact mapping for each list item.
List Form Fields have the standard General, Mapper, Choice Options, Choices from a Web Service, Layout, Conditions, Data, and Validation field properties, as described here.
Checkbox
A Checkbox Form Field allows you to present respondents with a series of options, some or all of which may be selected. A newly added Checkbox field will look like this:
There are a few different methods for adding items to your Checkbox field:
- Manually add checkbox items with the '+' icons shown in the screenshot above.
- Manually add checkbox items in the Choice Options field properties section.
- Copy choices from an existing Form Field in the Choice Options field properties section.
- Select Lead and/or Contact map fields in the Mapper field properties section. This will present you with the option to generate items based on the option values of the selected field, if and when the selected field has option values.
- Use the Choices from a Web Service field properties section to pull in checkbox items from an external URL. You will need to provide the URL, the path to the data, the join identifier, and the GET value to display.
The Choice Options field properties section allows you to individually set the Lead and Contact mapping for each checkbox item.
Checkbox Form Fields have the standard General, Mapper, Choice Options, Choices from a Web Service, Layout, Conditions, Data, and Validation field properties, as described here.
Boolean
A Boolean Form Field presents respondents with a toggle that must be set to one of two options. A newly added Boolean field will look like this:
The Boolean Field's labels can be adjusted in the General field properties. The mapping for each option can be set in the Mapping field properties, and the Lead and Contact values for each choice can be set in the Choice Options field properties.
Boolean Form Fields have the standard General, Mapper, Choice Options, Layout, Conditions, Data, and Validation field properties, as described here.
Multiselect
A Multiselect Form Field presents respondents with a drop-down list in which they can select multiple options. A newly added Multiselect field will look like this:
There are a few different methods for adding items to your Multiselect field:
- Manually add items with the '+' icons shown in the screenshot above.
- Manually add items in the Choice Options field properties section.
- Copy choices from an existing Form Field in the Choice Options field properties section.
- Select Lead and/or Contact map fields in the Mapper field properties section. This will present you with the option to generate items based on the option values of the selected field, if and when the selected field has option values.
- Use the Choices from a Web Service field properties section to pull in items from an external URL. You will need to provide the URL, the path to the data, the join identifier, and the GET value to display.
The Choice Options field properties section allows you to individually set the Lead and Contact mapping for each item.
Multiselect form fields have the standard General, Mapper, Choice Options, Choices from a Web Service, Layout, Conditions, Data, and Validation field properties, as described here.
Image
An Image Form Field allows you to insert an image into your Form. A newly added Image field will look like this:
Image form fields have the standard General, Layout, and Conditions field properties, as described here.
File Upload
A File Upload Form Field allows you to collect files from your Form respondents. Uploaded files will become available to you when the respondent submits the Form, both within the Form Submission and within the notification emails sent by the Form's Email Notification action, if applicable. A newly added File Upload field will look like this:
In a File Upload form field's General properties, you can configure some settings unique to this field type:
- File Source Type: Local File, Camera, Local File or Camera.
- Preview uploaded images: Choose whether to display a thumbnail preview for uploaded files when possible. When unselected, file icons will display instead.
- Wait for upload to complete: Ensures users won't complete the form until files are uploaded.
- Confirm the deletion: Triggers a prompt asking to confirm the file deletion, when a user clicks to delete an uploaded file.
- Accepted file categories: Provide an accept attribute description to specify the accepted file types.
- Maximum file size (in bytes): Specify the maximum file size in bytes.
- Placeholder Text: Provide placeholder text to display before a file has been uploaded.
File Upload fields have the standard General, Layout, Conditions, and Validation field properties, as described here.
HTML
An HTML Form Field allows you to add custom HTML into your Form. A newly added HTML field will look like this:
The HTML field's General properties contains an HTML Markup field where you can add your own HTML.
HTML fields have the standard General, Layout, and Conditions field properties, as described here.