Page Comparison

Canvas Launch API enables you to launch or open other apps (widgets) from the current app. Using this API you can launch the following:

• Launch another workspace
• Launch a Workspace and Layout
• Launch a workspace, layout, and then a widget
• Launch a widget in modal window
• Launch a form with container in Modal window
• Launch a form without container in Modal window
• Launch a form in an app with container
• Launch a form with form object and container in Modal window
• Launch a form with form object and without container in Modal window
• Launch a custom HTML Content in Modal Window
• Launch pre-defined dialog messages in Modal window

This is a core API which can be invoked in any event. The usage of canvas.launch() API has been explained with the following task as an example:

...

Let us assume a scenario where a user wants to transfer funds to a beneficiary by accessing the DOMESTIC FUND TRANSFER form in the PAYMENTS workspace on CT ModelHouse application. The user specifies the details and submits the form.

Image RemovedImage Added

After submitting the transaction, the user may now want to view the account summary in the ACCOUNT SERVICES workspace. In this case, when the user clicks the Submit button and after successful transaction, the ACCOUNT SERVICES workspace must be launched.

Image RemovedImage Added

In order to launch the ACCOUNT SERVICES workspace, the canvas.launch API has been used in the form’s listener JS file. The sample code is as follows:

CFLR.registerListener("CT_PAYMENT_FORM", canvas.form.listeners.paymentForm);

CABR.registerHandler('PAY_SUMBIT', 'PAYMENTS_FORM_CONTAINER', function(config)
{
	var fm = config.formObj;
	var refNo = fm.additionalConfig['reference_no'] || '';
	if (canvas.isEmpty(fm.model.getValue('ACC_NO')))
	{
		fm.markInvalid("ACC_NO");
		return;
	} else if (canvas.isEmpty(fm.model.getValue('BENE_ACC_NO'))) 
	{
		fm.markInvalid("BENE_ACC_NO");
		return;
	} else if (canvas.isEmpty(fm.model.getValue('TRANSACTION_AMT'))) 
	{
		fm.markInvalid("TRANSACTION_AMT");
		return;
	} else if (canvas.isEmpty(fm.model.getValue('TRAN_DATE'))) 
	{
		fm.markInvalid("TRAN_DATE");
		return;
	}
	var ajaxParams = 
	{
		"INPUT_ACTION" : "SUBMIT",
		"INPUT_FUNCTION_CODE" : "VSBLTY",
		"INPUT_PRODUCT" : "CUSER",
		"INPUT_SUB_PRODUCT" : "CUSER",
		"PAGE_CODE_TYPE" : "TXN_CODE",
		"PRODUCT_NAME" : "CUSER",
		"REFERENCE_NO" : refNo
	};
	canvas.apply(ajaxParams, fm.getModelData());
	canvas.ajax(
	{
		params : ajaxParams,
		success : function(response) 
		{
			var referenceNo = response.REFERENCE_NO;
			var text = response.STATUS == "SUCCESS" ? CRB.getBundleValue("common", "LBL_TRAN_SUCCESS") : CRB.getBundleValue("common", "LBL_TRAN_FAILURE");
			text = String.format(text, referenceNo);
			var successDialog = new canvas.Dialog(
			{
				dialogType: "MESSAGE",
				title: "Confirmation Window",
				message: text,
				okHandler: function()
				{
					successDialog.close();
					if (window.transactionComplete)
					{
						window.dispatchEvent(window.transactionComplete);
						return true;
					} else
					{
						CBXFORMCONTAINER.exit(config);
						if (fm.additionalConfig['widgetObj'])
						{
							widget = fm.additionalConfig['widgetObj'];
							widget.refreshWidgetData();
						}
					}
					canvas.launch(
					{
						workspaceId : "ACC_SERV_WSPACE"
					});
				}
			});
			successDialog.show();
		}
	});
});

...

1. Anchor
   launch_another_workspace launch_another_workspace

   Launch another workspace
   

   Syntax
   

   Code Block
   language text
   canvas.launch( { workspaceId : '<WORKSPACE_ID>', callback : <function(){}> (Optional) });

   Example
   

   Code Block
   language text
   canvas.launch( { 'workspaceId' : 'ACC_SERV_WSPACE' });

   
   

2. Anchor
   launch_workspace_layout launch_workspace_layout

   Launch a workspace and layout
   

   Syntax
   

   Code Block
   language text
   canvas.launch( { workspaceId : '<WORKSPACE_ID>', layoutId : '<LAYOUT_ID>', callback : <function(){}> (Optional) });

   Example

   Code Block
   language text
   canvas.launch( { 'workspaceId' : 'CHART_WS', ' layoutId' : 'CHART_LYT' });

   
   

3. Anchor
   launch_workspace_layout_widget launch_workspace_layout_widget

   Launch a workspace, layout, then a widget
   

   Syntax

   Code Block
   language text
   canvas.launch( { workspaceId : '<WORKSPACE_ID>', layoutId : '<LAYOUT_ID>', widgetId : '<WIDGET_ID>', callback : <function(){}> (Optional) });

   Example

   Code Block
   language text
   canvas.launch( { 'workspaceId' : 'LOANS_WS', ' layoutId' : 'LOANS_LYT', ' widgetId' : 'CT_LOAN_SUMMARY_WGT' });

   
   

4. Anchor
   launch_widget_modal_window launch_widget_modal_window

   Launch a widget in modal window
   

   Syntax

   Code Block
   language text
   canvas.launch( { renderType : 'WINDOW', widgetId : '<WIDGET_ID>', width : '<WIDTH_IN_%_OR_PXL>', (Optional) height : '<HEIGHT_IN_%_OR_PXL>', (Optional) fullScreenInd : <TRUE | FALSE>, (Optional) closeOnEsc : <TRUE | FALSE>, (Optional) modalDialog : <TRUE | FALSE>, (Optional) draggable : <TRUE | FALSE>, (Optional) callback : <function(){}> (Optional) });

   Example

   Code Block
   language text
   canvas.launch( { 'renderType' : 'WINDOW', ' widgetId' : 'CT_LOAN_SUMMARY_WGT' });

   
   

5. Anchor
   launch_form_modal_window launch_form_modal_window

   Launch a form with container in Modal window
   

   Syntax

   Code Block
   language text
   canvas.launch( { renderType : 'WINDOW', formId : '<FORM_ID>', containerId : '<CONTAINER_ID>', width : '<WIDTH_IN_%_OR_PXL>', (Optional) height : '<HEIGHT_IN_%_OR_PXL>', (Optional) fullScreenInd : <TRUE | FALSE>, (Optional) closeOnEsc : <TRUE | FALSE>, (Optional) modalDialog : <TRUE | FALSE>, (Optional) draggable : <TRUE | FALSE>, (Optional) callback : <function(){}> (Optional) });

   Example

   Code Block
   language text
   canvas.launch( { 'renderType' : 'WINDOW',' formId' : 'CT_PAYMENT_FORM', 'containerId' : 'PAYMENTS_FORM_CONTAINER' });

   
   

6. Anchor
   launch_from_without_modal_window launch_from_without_modal_window

   Launch a form without container in Modal window
   Syntax

   Code Block
   language text
   canvas.launch( { renderType : 'WINDOW', formId : '<FORM_ID>', width : '<WIDTH_IN_%_OR_PXL>', (Optional) height : '<HEIGHT_IN_%_OR_PXL>', (Optional) fullScreenInd : <TRUE | FALSE>, (Optional) closeOnEsc : <TRUE | FALSE>, (Optional) modalDialog : <TRUE | FALSE>, (Optional) draggable : <TRUE | FALSE>, (Optional) callback : <function(){}> (Optional) });

   Example

   Code Block
   language text
   canvas.launch( { ' renderType' : 'WINDOW',' formId' : 'CT_PAYMENT_FORM' });

   
   

7. Anchor
   form_rendered_app form_rendered_app

   Form rendered in an app with container
   

   Syntax

   Code Block
   language text
   canvas.launch( { formId : '<FORM_ID>', containerId : '<CONTAINER_ID>', RenderType : 'APP', workspaceId : '<WORKSPACE_ID>', layoutId : '<LAYOUT_ID>', widgetId : '<WIDGET_ID>', width : '<WIDTH_IN_%_OR_PXL>', (Optional) height : '<HEIGHT_IN_%_OR_PXL>', (Optional) fullScreenInd : <TRUE | FALSE>, (Optional) closeOnEsc : <TRUE | FALSE>, (Optional) modalDialog : <TRUE | FALSE>, (Optional) draggable : <TRUE | FALSE>, (Optional) callback : <function(){}> (Optional) });

   Example

   Code Block
   language text
   canvas.launch( { 'formId' : 'CT_PAYMENT_FORM', 'containerId' : 'PAYMENTS_FORM_CONTAINER', 'renderType' : 'APP', 'workspaceId' : 'ACC_SERV_WSPACE', 'layoutId' : 'ACC_SERV_LYT', 'widgetId' : 'EMPTYAPP' });

   
   

8. Anchor
   from_rendered_with_object_container from_rendered_with_object_container

   Form renders with form object and container in Modal Window:
   

   Syntax

   Code Block
   language text
   canvas.launch( { fm : '<fm_Obj>', containerId : '<CONTAINER_ID>', width : '<WIDTH_IN_%_OR_PXL>', (Optional) height : '<HEIGHT_IN_%_OR_PXL>', (Optional) fullScreenInd : <TRUE | FALSE>, (Optional) closeOnEsc : <TRUE | FALSE>, (Optional) modalDialog : <TRUE | FALSE>, (Optional) draggable : <TRUE | FALSE>, (Optional) callback : <function(){}> (Optional) });

   Example

   Code Block
   language text
   var frmMgr = new ct.form.FormManager( { formId : 'CT_PAYMENT_FORM' }); canvas.launch( {' fm' : frmMgr, ' containerId' : 'PAYMENTS_FORM_CONTAINER' });

   
   

9. Anchor
   from_without_container from_without_container

   Form renders with form object and without container in Modal Window:
   

   Syntax

   Code Block
   language text
   canvas.launch( { fm : '<fm_Obj>', width : '<WIDTH_IN_%_OR_PXL>', (Optional) height : '<HEIGHT_IN_%_OR_PXL>', (Optional) fullScreenInd : <TRUE | FALSE>, (Optional) closeOnEsc : <TRUE | FALSE>, (Optional) modalDialog : <TRUE | FALSE>, (Optional) draggable : <TRUE | FALSE>, (Optional) callback : <function(){}> (Optional) });

    Example

   Code Block
   language text
   var frmMgr = new ct.form.FormManager( { formId : 'CT_PAYMENT_FORM' }); canvas.launch( {' fm' : frmMgr });

   
   

10. Anchor
    html_content html_content

    Launch a custom HTML Content in Modal Window
    

    Syntax

    Code Block
    language text
    canvas.launch( { modalContent : '<HTML_DOM>', title : '<TITLE_OF_WINDOW>', (Optional) width : '<WIDTH_IN_%_OR_PXL>', (Optional) height : '<HEIGHT_IN_%_OR_PXL>', (Optional) fullScreenInd : <TRUE | FALSE>, (Optional) closeOnEsc : <TRUE | FALSE>, (Optional) modalDialog : <TRUE | FALSE>, (Optional) draggable : <TRUE | FALSE>, (Optional) callback : <function(){}> (Optional) });

    Example

    Code Block
    language text
    canvas.launch( { ' modalContent' : 'Hello' });

    
    

11. Anchor
    predefined_dialog predefined_dialog

    Launch pre-defined dialog messages in the modal window
    

    Syntax
    

    Code Block
    language text
    canvas.launch( { message : '<MESSAGE_OF_DIALOG>', dialogType : 'CONFIRMATION'|'MESSAGE'|'WARN_EDIT_OK'|'SUCCESS'|'ERROR'|'WARNING' width : '<WIDTH_IN_%_OR_PXL>', (Optional) height : '<HEIGHT_IN_%_OR_PXL>', (Optional) fullScreenInd : <TRUE | FALSE>, (Optional) closeOnEsc : <TRUE | FALSE>, (Optional) modalDialog : <TRUE | FALSE>, (Optional) draggable : <TRUE | FALSE>, (Optional) callback : <function(){}> (Optional) });

    Example

    Code Block
    language text
    canvas.launch( { 'message' : 'The mandatory fields are not filled-in', , ' dialogType' : 'ERROR' });