Skip to main content

Adding Forms

Last updated 29/06/2022

Creating Forms in Five​

The following documentation will explain the general steps to create a form for your application. Further documentation will need to be read to have an understanding of how you can turn your forms into highly complex event-driven forms.

General Steps to Add a Form​

Requirements

  • The role of Developer or Control
  • To create a form you will need at least one page and one form field.
  • At least one form field will need to be mandatory and included in the list.
  • The first page of your form have a Form page type.

Prerequisite

  • Your tables are established in Five.

Steps

  1. Select Forms in the menu.

  2. Click the Add Item button in the list app bar.

  3. Type a title in the Title field.

  4. Click the lookup icon in the Table field and select the required table.

  5. Click the Pages tab.


Add a Form
Figure 1 - Add a form

  1. Click the Add Pages button.

Add Pages Button
Figure 2 - Add Pages button

  1. Type a caption in the Caption field.

  2. Click the Fields tab.


Add Page with a field
Figure 3 - Add a page and select the Fields tab

  1. Click the Add Fields button.

Add Fields Button
Figure 4 - Add Fields button

  1. Click the lookup icon in the Field field and select the table field.

  2. Type a caption in the Caption field.

  3. Click the lookup icon in the Display Type field and select the required display type.

  4. Click all three Save buttons in the stacked form app bars.


Add a Field and Save the Form
Figure 5 - Add a field and save the form

Below is a quick video demonstrating adding a form in Five.


Add a Form Gif
Figure 6 - Add a form


Add Multiple Pages to a Form​

Requirement

  • The first page must have a page type of Form and have at least one field saved for the page.

Prerequisite

  • The General page details are completed.

Steps

  1. Click the Add Pages button.

  2. Type a caption in the Caption field.

  3. Use the lookup icon in the Page Type field and select the required page type.

  4. Use the lookup icon in the Action field and select the Action ID to reference.


info

A page type of Form does not need to reference an action in Five.


  1. Click the Save button in the form app bar.

  2. Repeat for the number of pages required.

  3. Click both Save buttons in the stacked form app bars after saving your final page.


Multiple Pages
Figure 7 - Add multiple pages to a form

Add Multiple Fields to a Form Page​

Prerequisites

  • The General page details are completed.
  • The page that the fields are being added to must have a Form page type.

Steps

  1. Click the Add Fields button.

  2. Use the lookup icon in the Field field and select the table field.


info

A field does not need to be selected if you do not need to store the data in the database.


  1. Type a caption in the Caption field.

  2. Use the lookup icon in the Display Type field and select the display type.

  3. Click the Save button in the form app bar.

  4. Repeat for the number of fields required.

  5. Click all three Save buttons in the stacked form app bars after saving your final field.


Multiple Fields
Figure 8 - Add multiple fields to a page

Create a Form with a Dependent Table​

The Dependent Table field will only list tables that have a dependency established in the database. If there are no dependent relationships in your database the lookup list will display 'No Options'.

Five supports the object-relational mechanism known as inheritance. Inheritance allows a table to inherit some of its column attributes from another table creating a parent-child relationship. This causes the child table to have each of the same columns and constraints as its inherited table as well as its own defined columns.

When selecting a dependent table in Five you will have access to the fields from both tables to select for your form.

Example

The following diagram shows the child entities inherit all the elements of their parent entity, plus have some additional ones unique to themselves. The parent entity takes on a 'Type' column to show what type of entity it is. In the diagram below, we can see the Entity table has three dependent tables. The EntityType column in the Entity table is to store which type of entity it is.


Dependent Diagram
Figure 9 - Dependent diagram


The Customer table has a dependent relationship with the Entity table. Inheritance is the mechanism that connects the Customer table to the Entity table, allowing the Customer table to automatically acquire the Entity (parent) table's properties and methods.

Requirements

  • The main table must have a 'Type' field. The type indicator is a mechanism for determining the type of entity. For example, the Entity table may include an indication of whether the entity represented by the table row is a customer, motor dealer or contact.
  • The Type field on the form requires a default value to be stored in the database's main table (Entity table). For example, C for customer.
  • The Show If field for the Type field needs to be false to hide the field on the form.

Prerequisite

The dependent relationship must be established at the table-level.

Steps

  1. Click the Add Item button in the list app bar.

  2. Type a title in the Title field.

  3. Use the lookup icon in the Table field and select the parent table. For this example, the Entity table.

  4. Use the lookup icon in the Dependent Table field and select the dependent table. For this example, the Customer table.

  5. Click the Pages tab.


Add a Form with a Dependent Table
Figure 10 - Add a form with a dependent table

  1. Click the Add Pages button.

Add Pages Button
Figure 11 - Add Pages button

  1. Type a caption in the Caption field.

  2. Click the Fields tab.


Fields Tab
Figure 12 - Add a page and select the Fields tab

  1. Click the Add Fields button to add the type field.

Add Fields button
Figure 13 - Add Fields button

  1. Use the lookup icon in the Field field and select the table field. For this example, the EntityType field.

  2. Type a caption in the Caption field. For this example, Type.

  3. Click the Include In List switch to remove from a true state.

  4. Type false in the Show If field.

  5. Use the lookup icon in the Display Type field and select _Text.

  6. Type a value to be stored in the database in the Default Value field. For this example, C.

  7. Click the Save button in the form app bar.


Add the Type Field
Figure 14 - Add the Type field

  1. Click the Add Fields button.

Add Fields Button
Figure 15 - Add Fields button

  1. Repeat for the number of fields required for the form.

  2. Click all three Save buttons in the stacked form app bars after adding your final field.


Save the Form
Figure 16 - Add a field and save the form


info
  • The Field field will hold all the fields from both of the tables.
  • Ensure you have at least one field included in the list if your 'Type' field is the first field on the form.