- Help center
- Developers
- General
Use data binding and form relationships with custom forms
Data binding is useful for applying control classes (e.g., spinners, date / time pickers...) to form elements. Custom forms can also be linked to other custom forms and auto-populate when information is entered into a corresponding form. This article details how data binding and form relationships are configured.
Prerequisites
- Importing HTML forms to FocalScope's custom form repository
- Creating custom (HTML) forms in FocalScope
Tutorial
Creating data bindings on form elements
After creating or importing your custom form, create a data binding on an element as follows:
- Click or highlight a suitable element
- Click the [Data Binding] button (highlighted in red)
- In the [Data Binding] pop up (highlighted in blue), select a class for the element. Options: date, time, spinner, lookup. Please note, the lookup class requires a master-detail relationship between at least two forms, namely, a master and a detail form
- Continued in next section...
Figure 1 - Creating a data binding on an element
Creating a master-detail relationship between forms
Form relationships comprise of a master form and one or several detail forms. The master form is where all data entered into the detail forms will collect automatically. To create a master-detail relationship, do as follows:
- Open the detail form and double-click the text field that will be referenced by the master form
- In the [Text Field Properties] pop up, note the name of the field
- Open the master form, click the field that will received the data from the referenced field in the detail form and click the [Data Binding] button
- In the [Data Binding] pop up, select the detail form in the left [Data Source] dropdown list; in the right dropdown list, select field as noted in the previous step
- In the [Class] dropdown list, select [lookup]
- Click [Ok], and [Save] to save changes. The master-detail relationship has now been created
- Repeat steps 1 & 2 for other fields that the master form has to reference from detail forms
- Continued in next section...
Figure 2 - Creating a master-detail relationship
With the data bindings and master-detail relationship configured, the [Master form] is ready to use.
- When the element with a lookup data binding is clicked, the detail form will load as per the master-detail relationship configuration
- An agent then enters data into the referenced field (in this case the [Detail from data] field)
- The master form auto-populates itself with the data entered into the referenced field(s) in the detail form
Figure 3 - Fully functional data binding and master-detail relationship
Additional Information
Setting up a custom (HTML) forms folder