Multi-Form is an advanced option, which allows the developer to show a same form on a parent form as many times as required.
Similarly, Sub Form is a form added attached on a form using the Form Panel as a regular form items.
For Example: Consider the below information for creating a multi-form:
- Biller Info form – this form is the parent form containing a sub form with labels and a multi-form.
- Biller Label form – this form is a sub form just containing the labels Biller Name, Biller Amount, and the Area Code.
- Biller Detail form – this form contains the only 3 form items to capture the Biller Info but rendered on the parent form as many times using its Initial Multiplicity property.
Form Creation
Use the following table to create a sample Form and Multi-form.Also, see Form and Multi-Form for further details.
Form ID | Form Title | Data Source Class |
BILLER_INFO | LBL_BILLER_INFO |
BILLER_LABELS | BILLER_LBLS |
BILLER_DETAILS | BILLER_DT |
Form Items Creation
Use the following table to insert the required form items. Also, see Configuring Form Items Definitions for further details.
Form ID | Item ID | Form Item | Display Name Key |
Category: Adding the multi-form and Sub Form on the main | |||
form | |||
BILLER_INFO | BILLER_LABELS | FORM | |
BILLER_INFO | BILLER_DETAILS | FORM |
Category: Adding the items in the Sub Form | |||
BILLER_LABELS | BILLER_NAME | LABEL | BILLER_ NAME |
BILLER_LABELS | BILLER_AMOUNT | LABEL | BILLER_ AMOUNT |
BILLER_LABELS | AREA_CODE | LABEL | AREA_C ODE |
Category: Adding the items on the Multi- | |||
Form | |||
BILLER_DETAILS | BILLER_COMPOSIT | FORM COMPOSIT | |
BILLER_DETAILS | OPT_BILLER | RADIO GROUP |
BILLER_DETAILS | TXT_BILLER_NAME | TEXT |
BILLER_DETAILS | TXT_BILLER_AMT | AMOUNT |
BILLER_DETAILS | CMB_AREA_CODE | COMBO |
Form Container Creation
Use the following table to create the form container. Also, see Form Containers for further details.
Form ID | Container |
|---|
ID | Title | Action |
|---|
ID | Action Type | Position | |||
|---|---|---|---|---|---|
BILLER_INFO | CONT_BILLER_INFO | BILLER_INFO | BTN_SAVE | Positive | 1 |
BTN_ADD | Positive | 2 |
BTN_DEL | Positive | 3 |
BTN_CANCEL | Negative | 4 |
After configuring, write the handlers to launch the form on a menu click. See Showing the form on Menu click for more details.
The form should appear as shown:
To add an instance of the form, use the fm.addNext('FORM_ID') API as shown:
| Code Block | ||
|---|---|---|
| ||
CABR.registerHandler('BTN_ADD','CONT_BILLER_INFO', function (config) { this.fm = config.frmObj; |
...
this.fm. |
...
addNext('BILLER_DETAILS'); |
...
}); |
To delete an instance of the form, use the fm.removeAt(formIndex,'FORM_ID'); API as shown:
cbx
| Code Block | ||
|---|---|---|
| ||
canvas.ns("my.listner.namespace"); my.listner.namespace.BillerInfoForm = Class( |
...
canvas.Observable, { |
...
constructor : function (config) |
...
{ this.fm = config.fm; |
...
}, |
...
registerHandlers : function () |
...
{ var formIndex=null; |
...
this.fm.registerHandler( |
...
CFEC.CHANGE,"OPT_BILLER", function(fm, event, fieldname, value, index, parent) |
...
{ //finding the index of the instance to be deleted formIndex=index; |
...
var count = fm.getNumberOfSubForms('BILLER_DETAILS'); for(var i=0; i<count; i++) |
...
{ if(i!=index) { fm.model.setValue('OPT_BILLER',"",false,i,parent); |
...
} } }); |
...
} |
...
}); |
...
CFLR.registerListener("BILLER_INFO", my.listner.namespace.BillerInfoForm); |
...
CABR.registerHandler('BTN_ADD','CONT_BILLER_INFO', function (config) { |
...
fm.removeAt(formIndex, 'FORM_BBAR_MULTI'); |
...
}); |