Unit 9. Interactive Forms (I)

We’ll see what a form is, why it’s used, how to insert one, which elements it can contain, and how to validate the data introduced into it.

Forms are used to get users data, they can also be used to make orders in a virtual store, to create a survey, to know users opinon, receiving questions, etc.

Once the user has filled out the data and clicked the button to send the form, a program will start, and will receive the data and make the required treatment.

Here, we’re going to see how to create a form (insert fields and buttons into the form and validate them) but not the data treatment yet, because you need programming knowledge, like VBScript, JavaScript or other programming language and this part isn’t in the objective of the course.

On the right you have an example of a form.

A form can have labels, text fields, drop-down menus, and buttons.

The form elements can be inserted into a page through the Insert menu and then selecting the Form option.

Through this option you can access the list of all form objects that can be inserted in a Page.

Let’s look at some of the different elements that can compose a form, and also some of its properties.

 Text Field:

Allow you to add a text box. The text field only allows the user to write a line, while the Text Area allows the writing of many. You can convert it into a Text Area through the properties inspector.

It’s also possible to define it as Password, so the text field characters will be hidden and shown as the image below.

Next you have an example of each one of the three types.You can write on them to see how they work.

Through the propierties inspector it’s possible to assign the width of the text box, the top number of lines or characters, and the initial value of the box.

 Button:

The button can have three options assigned: Submit form, Reset form (clear all the form fields), or None (to assign a different behavior to the previous two)

You can also change the text button through the Label option of the properties inspector.

 Check box:

Is a little square that can be activated or deactivated:

It can be set in its initial status as Checked or as Unchecked.

 Radio button :

Is a little circlular button that can be selected or deselected. If there are many in the same form only one can be activated. When you activate one, the others are automatically deactivated.

 List/Menu:

A list or a menu is a form element associated to an option list.

The elements are added through the List Values button of the properties inspector.

When it comes to a menu, it is only possible to select one of the elements, but if it comes to a list many can be simultaneously selected editing the Selections option of properties inspector.

 Label:

Is used to name the rest of the elements of the form, so that the user is able to know which data to introduce into each one of them.