Creating a Sample Multi-Form

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:

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:

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'); 
});