Form Elements and Field Types Overview
- Former user (Deleted)
- Rebecca David
- Jane Padgett
The following can be found in the panel which appears on the left of the screen in Form Designer. Users can expand or reduce the panel to make viewing and navigating the options easier or to give your form panel more area.
Form Elements
These can be seen as the building blocks and fillers for a form. They allow users to separate information into Sections, break up user fields using Spacer Rows, compile user fields into Lists and use Labels to show the descriptions of user fields or place free text. Users can also insert a Link(URL), Related Summary, Image, and QR Code onto a form.
Image
Images that have a URL and end in jpg, jpeg, and png can be added to a form. Refer here for how to add and configure an image.
Please note you cannot add an image element to a List Control
Snapshot of the Image element in the Form Designer.
Snapshot of the Image element when viewing a form.
Label
A label can have up to 2000 characters. This includes all formatting, HTML tags, spaces and line breaks.
A label can be used as a standalone cell type, or linked to a User Field.
Standalone:
A Label can be used to insert a heading, static text, etc. Simply drag and drop the label into the Form Area and expand to fill the desired number of cells.
Linked:
To link a Label to a User Field, simply place the Label on your form and drag the User Field on top of the Label cell. This will link the two fields together, and your User Field will still remain in the original cell position if it had already been placed on your form.
If you place the Label and then drag the User Field on top before placing the User Field on the grid, it will simply link to the Label cell however the User Field will return to the side panel, waiting to be placed on the form.
A benefit of linking the user field with the label is that when user field descriptions are updated in the user field configuration section, the labels on the form will also be updated.
You can tell that a Label is linked to a User Field as it will display the Linked icon next to the field name.
Snapshot of the Label element in the Form Designer.
Snapshot of the Label element when viewing a form.
Multi Row Labels
You can add multiple rows in label. Press Shift + Enter to go done a row.
Snapshot of the Label element with multiple rows in the Form Designer.
Snapshot of the Label element with multiple rows when viewing a form.
Asterix Appears Beside Required User Field Labels
When a User Field configured as “Required” is added to the form designer and linked to a label, an asterisk (*) will automatically be added at the end of the label to indicate its required status.
Snapshot of the Label element with “Required” user field linked in Form Designer.
Snapshot of the Label element with “Required” user field linked when viewing a form.
For more information on Mandatory User Fields click here.
Link(URL)
A URL hyperlink element can be added to a form.
Simply drag and drop in the URL element to your form. Insert the Link(URL) and customise the display text and click save.
Below is showing how to insert a Link(URL) onto a form in Form Designer.
Snapshot of the Label element when viewing a form.
List
Lists can be used to store information in a List Table within the form.
The number of columns is determined by the number of user fields place within the list table on the form.
For more information about List Tables, please click here.
Snapshot of the List element in Form Designer.
When using the form, rows can be added, deleted, inserted before or after and populated as required. For bulk entry, users are able to download an excel template to fill the required data, then simply either copy and paste the data out of the excel document and paste into the List or use the Import from Excel button.
Lists are able to contain User Fields only.
Snapshot of the List element when viewing a form.
Section
Putting Form Elements and Form Types into a Section helps to keep similar information together. For example, you may choose to contain all Deliveries related data in a section called Deliveries.
Sections can be configured to:
remain collapsed or expanded when creating the form.
only be seen by certain users, groups, roles, companies etc.
only show the section when a user field somewhere else of the form meets the criteria set. (Logic)
Refer here for more information on Sections.
Snapshot of the Section element in Form Designer.
From the users perspective, a collapse feature has been added so that sections of information which have already been entered and no longer require visibility can be folded down to save screen space and reduce the need for long scrolling documents.
Snapshot below of the Section element when viewing the form. The 'Weather' and 'Visitors' sections have been collapsed, with the 'Deliveries', 'Plant' and 'Labour' sections remaining expanded. (In the below example, the Sections contain List Tables.)
Place Sections First
Sections may contain any form element or form type. Rows can be added and removed as required. When deleting a Section, data placed within the section will also be removed from the form. These form elements or form types will be available on the left hand pane of the Form Designer.
It is best to start with a plan and place the Sections on your form at the beginning.
Spacer Row
Spacer rows are used to create a space narrower than a standard row to make a gap between information.
When placing a Spacer Row, drag from the panel on the left onto your form grid. The Row will be placed above the highlighted row on the grid.
Data cannot be entered in a Spacer Row.
Related Summary
Related summary displays information as a summary table, from user fields of related forms, on the form that Related Summary is configured on. You can pick the related user fields from multiple forms, to display on the target form.
It allows users to create concise summaries of related data from different form types.
When adding the Related Summary element to a form, users can specify the form types they wish to include in the summary report.
Subsequently, a list of available fields from the selected form types is presented for users to choose from and add to the Related Summary table.
It is dynamically populated with data obtained by reading related forms, providing users with a comprehensive overview of interconnected information.
Users have the flexibility to add one or more Related Summary tables to a single form, enabling them to efficiently organise and analyse related data.
Refer here for how to configure the Related Summary.
Related summary is different from related report in that, related report just shows the forms associated to one form. Related summary shows info of user fields within those associated forms. Also related summary gives you flexibility to chose which related forms you want to see user field information on
Snapshot of the Related Summary element in Form Designer.
Snapshot of the Related Summary element when viewing a form. Configured to show the latest form.
QR Code
Our QR code function allows users to create a QR code.
Snapshot of the QR Code element in Form Designer.
Drag and Drop: Users can drag and drop the QR Code element into the layout, similar to the image element.
Display Placeholder: Once added, the QR Code element will display as [QR Code Element].
Empty QR Code: When creating a new form, an empty QR Code element will be shown on the new form screen.
QR Code Generation: After the form is created, a QR code will be generated based on the form link and updated on the form.
Snapshot of QR Code element in form view.
QR Code Format: The format of the QR code is https://mobile.itwocx.com/?qr=type={QR Code Type}|{Project Id}|{Form Type Id}|{Document Id}.
QR Code Scanning: When scanned using the RIB CX app, the form will load if the user has access to it.
User Fields
As with the other elements, User Fields can simply be dragged from the Left Panel and placed on the grid as desired.
Create
Users can Create a new User Field directly within the Form Designer.
To create a new user field, switch to 'Create' to view all of the user field types available for you to add to your form.
Once a new user field is placed on a form in Form Designer refer here for how to configure each type of user field.
Link Existing
User can Link Existing User fields. Switching to this tab will show you User Fields that have already been created for this form (refer here for how to create user fields) or are a common user field (refer here for information about common user fields).
For forms which may have multiple same/ similarly named fields, hovering over the field in the left panel will display the User Field Code and Full Description to make placing the correct user field easier.
Hovering over user field labels will show their code. This is useful when one or more of your user field descriptions are the same but the code is different.
'Edit Details'
Within the Form Designer, you also have the option to 'Edit Details' for each of the User Fields.
User Field Types
For additional detail about configuring the different types of user fields, click here.
For additional information regarding editing user fields, click here.
Standard Fields
Along with the Form Elements and User Fields, there are also some Standard Fields available to use when building your form.
Standard Fields are Not Editable
Standard Fields are not editable by the user, and instead are auto-populated based on the range of data types available.
Details about each of the elements available for use on your forms can be found in the table to the right.
Below is an example of each of the standard fields on a form.
Labels Have Been Added
For the above example, Labels have been placed to the left of each of the Standard Fields stating their names.
When placing a Standard field, it will not come with an accompanying Label/ Description field. You will need to place these on the form yourself, if you wish.
Below are the types of standard fields available and what they mean.
Type | Info | |
|---|---|---|
Project Elements | Project | While the project number will always be visible in the header of your form, in some instances you may choose to show the Project (Code) in another location within your form as well. In these cases, you can use the Project element. |
Document Elements | Date Changed | This will show the Date the form was last Changed |
| Date Due | The Date Due (if applicable) will by default be always be visible in the header 'Details' of your form, although if you wish to display this in another location on your form as well, you can use the Date Due document element. |
| Date First Closed | This will show the date the form was first moved to a closed status. |
| Date First Viewed | This will show the date the document was first viewed by the Action User. Forms with Multiple Open Statuses For forms with custom workflows, there may be multiple open statuses. This form element will populate with the date when the Action User first viewed the form. Be mindful of this if reporting using this field on forms with multiple open statuses. |
| Date Issued | The Date Issued will by default be always be visible in the header 'Details' of your form, although if you wish to display this in another location on your form as well, you can use the Reference Number document element. |
| Document Code | This will display the Document Code, for example 'DEF' for a Defect form, or 'ITP' for an ITP. |
| Reference Number | The Reference Number will by default always be visible in the header 'Details' of your form, although if you wish to display this in another location on your form as well, you can use the Reference Number document element. |
| Status | The Status will by default always be visible in the header 'Details' of your form, although if you wish to display this in another location on your form as well, you can use the Status document element. |
| Title | The Title will by default always be visible in the header 'Details' of your form, although if you wish to display this in another location on your form as well, you can use the Title document element. |
| Waiting Days | The number of days the form has been in the current status. |
| Float days | The number of days since the form was issued. |
Addressing Elements | Action Company Name | This will display the Action Company Name. That is the company of whoever is the Action person on the form at the time of viewing. |
| Action Company ID | This will display the Action Company ID. That is the company of whoever is the Action person on the form at the time of viewing. |
| Action ID | This will display the ID of the user the form is currently for Action to at the time of viewing. |
| Author Company ID | This will display the Company ID of the user who Authored the form. This will not change once first set. |
| Author Company Name | This will display the Company Name of the user who Authored the form. This will not change once first set. |
| Author Display Name | The Author Display Name will always be visible in the header of your form, although if you wish to display this in another location on your form as well, you can use the Author Display Name document element. This will not change once first set. |
| Author First Name | This will display the First Name of the user who Authored the form. This will not change once first set. |
| Author Last Name | This will display the Last Name of the user who Authored the form. This will not change once first set. |
| Author ID | This will display the ID of the user who Authored the form. This will not change once first set. |
Go to This Section Next
- 1 Form Elements
- 1.1 Image
- 1.2 Label
- 1.3 Link(URL)
- 1.4 List
- 1.5 Section
- 1.6 Spacer Row
- 1.7 Related Summary
- 1.8 QR Code
- 2 User Fields
- 2.1 Create
- 2.2 Link Existing
- 2.3 'Edit Details'
- 3 Standard Fields