Graphical User Interface (GUI)
Last updated 14/04/2022
Five's Form Wizard Design Pattern
Five's Form Wizard is a custom form conveying progress through several steps in a logical process that allows you to input information in a prescribed order. Subsequent steps will depend on information entered in previous steps. The wizard has been designed to be a quick and easy method of creating forms that allow for validation, as when any steps are overlooked, Five will not permit you to save the form and will return you to the necessary sections that need completion. Five will generate a lot of definitions in the Form Wizard that you set at the table-level.
After you create a form with Five's Form Wizard, you can then modify or delete objects by selecting the record in the list and using the form.
Five's Form Wizard GUI
The Form Wizard is divided across two pages. To navigate between the two pages use the Previous and Next buttons positioned below the wizard app bar.
The first page is divided into the following sections.
- General
- Menu
- Pages
The second page will list all the fields from your selected table. The fields will have their predefined definitions that were set at the table-level, these definitions are editable.
General
The General section is for you to select the table that will store the data collected from your form.
The General section consists of the following fields.
| Field | Description |
|---|---|
| Main Table | Select the table holding the fields required for your form. All the tables in your database will be available in the lookup list. |
| Dependent Table | Select the dependent table holding the fields required for your form. This field will only become active after a main table has been selected. Only tables with a dependent relationship will be available in the field's lookup list. |
| Name | Give your form a name. Five will populate the field with the same value as the Table field in a plural form on the first instance. |
| Action ID | Uniquely identify your form. Five will populate the field with the same value as the Name field on the first instance. |
| Page Navigation | Select how your users will navigate through your form. Default: Top. |
Menu
The Menu section is where you can specify whether the form requires a menu item and if it should be positioned under a parent menu.
The Menu section consists of the fields listed below.
| Field | Description |
|---|---|
| Add Menu Item | Add a menu item for the form. Default: true |
| Caption | Give your menu item a caption. Five will populate the field with the same value as the General's section Name field on the first instance. |
| Parent Menu | Select a menu item to become the parent for the current menu item. All the menu items saved in Five will be available in the field's lookup list. |
Pages
The Pages section is for you to divide your form over different pages.
The Pages section consists of the fields listed below.
| Field | Description |
|---|---|
| Type | Select the type of page. Options - Form, List, Join, or Action. |
| Action | Select the action to reference for the page. This field will only be available with the page type selection of List, Join, or Action. |
| Caption | Give your page a caption. |
Fields General
Your field properties will be defined on the second page of the wizard. The majority of the field properties will be populated by Five. All of these properties are editable to suit your requirements. You can perform the following here:
- Remove fields.
- Add fields not attached to the database.
- Reorder fields.
- Reference other forms.
- Select a dependent field.
- Edit captions and display types that have been carried through from the table-level.
- Select if a field is to be required, read-only and/or included in the list.
The Fields General section consists of the fields listed below.
| Field | Description |
|---|---|
| Field | Select the table field name. |
| Caption | Give your field a caption. |
| Display Type | Select how you want to display the data in your end-user application. |
| Reference | Select a form to reference. For Five to populate this field the referenced form will need to be saved in Five first. |
| Dependent | Select a field from the current form on which this field will be dependent. This field will be reset if the field on which the current field is dependent changes. |
| Required (Req). | Select to make the field required. |
| Read-Only (RO) | Select to make the field read-only. |
| List | Select to include the field in the list. |
App Bars
There are two app bars. The list app bar is located above the list of records. The Form Wizard app bar is located at the top of the wizard.
List App Bar
The list app bar holds the following buttons and functionality.
| Button | Description |
|---|---|
| Filter | Filter by a field with a display type of _Text, _Integer, _Float, or _Boolean. |
| Search Bar | Start typing to reduce the list of records in the list. |
| New Form Wizard | A new Form Wizard is made available. |
| Add Item | A new form is made available. |
Form Wizard App Bar
The Form Wizard app bar holds the following buttons.
| Button | Description |
|---|---|
| Cancel | Cancel all changes and remove the Form Wizard. |
| Save | Will become available when editing has been performed in the wizard and will save all changes. |
| Next | Located just under the app bar and will navigate you to the next page of the wizard. |
| Previous | Located just under the app bar and will navigate you to the previous page of the wizard. |
Default Settings
Five predefines several properties in the Form Wizard to help you quickly create a form. You can edit these properties in the wizard either by typing new entries in the fields, using the lookup icons in the fields, or selecting the checkboxes. The following information will provide you with an overview of Five's default settings.
On selecting a table in the Main Field the following fields will be populated.
Page One
| Field | Default Setting |
|---|---|
| Name | The field will be populated with the plural form of the specified main table's name. Exception, a dependent table is selected then the Name field will populate with the plural form of the specified dependent table's name. |
| Action ID | The field will be populated with the same value as the Name field. Whitespace and symbols will be removed. |
| Page Navigation | Default is Top. |
| Add Menu Item | Default is true. |
| Pages | The initial page of your form is captioned General and is defined as a Form Page type. |
You can edit the caption of the first page, however, it must keep the default of Form as its type.
Page Two
| Field | Default Setting |
|---|---|
| Caption | The field will populate with the same name as the field in the table. Five will insert a space between any capitalized words. |
| Reference | If a form has previously been saved in Five that the current form references, the field will populate with the reference form name. |
| Required (Req) | The first field will default to required. |
| List | The first field will default to be included in the list. |
Properties Carried Through From the Table-Level
Five carries through several properties defined at the table-level. The following documentation will provide you with an overview of the properties that are carried through from the table-level. These values are editable.
| Field | Description |
|---|---|
| Field | The name and the order of the table field will be carried through to the Fields field. |
| Display Type | The Display Type field will inherit the default display type defined at the table-level. If no default display type was defined at the table-level, Five will populate the field with the most appropriate display type based on the data type defined at the table-level. |
If a field is set to required at the table-level and you set this field to not required at the form-level, the table-level definition will take precedence.
Editing With the Form Wizard
The wizard is designed to create forms quickly and easily, for this reason not every capability is available in the wizard. You may need to edit the record after saving to add extra features and functionality not available. Editing can be performed by selecting the Form record in the list and clicking the Edit button in the form app bar.
