The Insert Field window

Step 4 - Pages > Contact Form Object > The List section >

The Insert Field window

Previous pageReturn to chapter overviewNext page
Show/Hide hidden text

The Insert Field window opens when you press the Add... and Edit... buttons in the Contact Form Object window. Here, you can create and define the fields in the contact form.

This window has the following sections:

Field Type
Options
Click to expand/collapseReference: Commands in the Field Type section

You can use the options in this section to create the list of fields that will make up your contact form.

The available options are:

Text field: a single line of text shown as an empty box that the visitor can fill in as he wishes.

E-mail Address: a single line of text where the visitor must give an e-mail address. An automatic filter checks the address format: valid e-mail addresses contain the "@" character and a "." (dot).

Text Area: this text field covers more than one line, and the visitor can leave comments or ask questions.

Date: a text field where the visitor enters the date. It can either be typed in or selected from the calendar.

Drop Down List: the visitor must choose a reply from the drop-down list.

List: the visitor must select a reply from those in the list.

Multiple Choice: the visitor can select one or more replies from those in the list.

Single Choice: the visitor can choose one reply from those in the list.

Password: a text field in which the characters typed in are hidden, and dots or asterisks are shown to cover the letters (depending on the operating system on the computer). This policy is adopted to ensure a visitor's privacy when entering a password to access a service.

Attachment File: a text field in which the visitor can specify a file to send as an attachment, using the button to browse through the available files.

Contact your webspace provider to check that attached files are handled correctly.

Check Question: a text field in which the visitor enters the reply to a question. These questions are intended to differentiate between real people and spam programs that use contact forms to send undesired e-mail.

Agreement Conditions: a text field that gives the conditions that the visitor must agree to to submit the form. This field is used, for example, to show the conditions for matters of privacy on submitted data management.

Separator: this is a separator, and not a field, and it is used to separate the fields in sections and make long forms more user-friendly.

Description: this field is useful for displaying text in a form. It can be used, for example, to add brief introductions to the various sections of a form, or to give explanations to visitors.

Various options may be presented, depending on the type of field selected. The options available for all fields are:

Label: you can give a description of the field. This text will be displayed above, next to, or inside the field it refers to, to specify the requested information or to show the question the visitor is being asked. The Label for the Description field  isn't displayed in the form, but only appears in the summary table shown in the Contact Form Object | List window.
Width (%): you can define the field's width (from 5% to 100% of the available space).
Display on the same row as the previous Field: select this option if you want your field to be on the same row as the previous field. Two fields can only be on the same row if their total width does not exceed the row's width.
Set as Mandatory Field: this option makes the field mandatory for the visitor. It is not available for the Multiple Choice fields, and it is active by default for the Check Question fields.

The following options are field-specific.

Text field:

Max number of characters: specify the maximum number of characters that can be entered in this field. For example, you can specify a maximum of 15 characters for a field where the visitor enters his VAT number.
Input Text Filter: the visitor's data in the field will be checked. The possible filters are:
None (characters and numbers): both characters and numbers are accepted.
Numbers only: only numbers are accepted.
Phone/Fax number (numbers and '-' and ' ' chars): numbers, the "-" character and spaces are accepted.
Date (numbers and '/' and '. ' chars): numbers and the "/" character are accepted.

E-mail Address:

Request e-mail address confirmation: adds another field in which the visitor must repeat his e-mail address. The exact correspondence between the two fields is checked automatically: if the fields do not match, a warning message is displayed.

Text Area:

Max number of characters: specify the maximum number of characters that can be entered in this field.
Number of rows: specify the height of the field, giving the number of rows to be displayed (max. 30).

Date:

Date Format: you can choose the format for entering the date, selecting from the normal national and international formats.
Display 'Calendar' icon: this option displays the "Calendar" icon next to the Date field. When this icon is clicked on, the visitor can select the date from a calendar, without having to type it in.

List:

Number of rows: specify the height of the field, giving the number of rows to be displayed (max. 30).

Multiple Choice/Single Choice:

Number of columns: this options defines the number of columns on which the possible choices are shown.

Password:

Request password confirmation: adds another field in which the visitor must repeat his password. The exact correspondence between the two fields is checked automatically. If the fields do not match, a warning message is displayed.

Check Question:

Correct answer: this field contains the correct answer that will be matched against the visitor's answer.

Agreement Conditions:

Agreement Text: you can enter the text of the conditions that the visitor must accept before submitting data.

Separator:

Text Color: specifies the color to use for the text.
Line Color: specifies the color to use for the separator line. If you set the color as Transparent, the separator line is invisible and only the Label text is seen.
Display data in a new frame: the fields after the separator are not shown immediately, but in a new frame which the visitor can display by clicking on the Next button (added automatically at the bottom of the e-mail).

Description:

Number of rows: specify the height of the field, giving the number of rows to be displayed (max. 30).
Font Type: specifies the font, style and size to use for the text.
Text Color: specifies the color to use for the text.
Alignment: specifies how the text is to be aligned. It can be Left, Center or Right.
Outer Margin / Inner Margin: you can define the size of the field's internal and external margins in pixels.

Finally, you can create a list of possible replies for the Drop Down List, List, Multiple Choice and Single Choice fields, with the following commands:

Add / Remove: select a reply to add a new version or remove the current one.
Move up / Move down: you can change the order of the replies in the list, moving the selected item one position up or down.
Edit: you can edit the selected reply. If a reply is already selected, click again to edit it.
Click to expand/collapseReference: Commands in the Options section

You can use the options in this section to work on some advanced settings for the field in the contact form.

The options are:

Field Description: you can write a message to explain, for example, what information is required in the field and how to reply. If you use this option, an icon (that can be customized) will be shown next to the field and the message will be displayed in a tooltip that appears when visitors pass the mouse over the icon.
<name> attribute: this gives the value for the field's <name> attribute when the HTML code for the contact form is generated This option is useful when, for example, Send data to a file is set as the Data submission method (see Contact Form Object | Send).
Database Field Name: this gives the name of the field so that collected data can be correctly recognized and added to a database. This option is useful when, for example, Send data to a Database is set as the Data submission method (see Contact Form Object | Send).

 


Best practices:

-

How to work on the Contact Form Object