Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

The most demanding usage of forms is to display data from the database and to post data in the database. This section explains about how to save form data in the database.

The following diagram illustrates the form data submission flow:Image Removed                                                                                                                             Creating

Image AddedCreating JS listener class for the Form

When a form or form item action is triggered by the handlers, Canvas executes its corresponding actions registered with the global form listener key CFLR. This provides the freedom to the developer to write their action logic anywhere within their application.

It is best practice to keep the listener class files separated from the other action files. The structure of the JS listener class should be as follows:

Code Block
languagejs
cbxcanvas.ns("namespace idID");

listenerClass<namespace ID>.sampleListener = Class(cbxcanvas.Observable, 
{
  	  constructor: function(config) 
		{
		},
			//Inside the following function, listeners related to all form components are registered. 
			registerHandlers:function()
				{ 
					//Form Listener 
					//this.fm.registerHandler('cbxpremodelload', function (fm, record){ 
					}); 
//Form Item Listener 
// this.fm.registerHandler("cbxdateclear", "<FORM_DATEFIELD_ID>", function (fm, event, 
fieldName, value)
	{
        this.fm = config.fm;
    },
    
	registerHandlers: function() 
	{
		this.fm.registerHandler(CFEC.PRE_INITIALIZE, function(fm) 
		{
		
		});
		
		this.fm.registerHandler(CFEC.POST_FORM_RENDERER, function(fm) 
		{
		
	    });
		
		this.fm.registerHandler(CFEC.PRE_MODEL_LOAD, function(fm, record) 
		{
        
      	});

	}
});

CFLR.registerListener("FORM<FORM_IDID>", listenerClass<namespace ID>.sampleListener);

	// Form Container Action button listener

	//*
		CABR.registerHandler('ACTION_BUTTON_ID','CONTAINER_ID', function (config)
{  	}); */ 

Create a listener 

Create a listener payments.intertransfer.js

...

as

...

follows:

...

Code Block
languagejs
canvas.ns("payments");

payments.paymentForm = Class(cbxcanvas.Observable,

{ 
	constructor : function (config)
		{
			this.fm = config.fm;
		}, 

	registerHandlers: function()
	{ 
	}

});

CFLR.registerListener("PAYMENT_FORM", cbx.form.listenerspayments.paymentForm); 

CABR.registerHandler('SUBMIT','PAYMENTS_CONTAINER', function (config)
	{
	//Form submit action goes here
	}); 

CABR.registerHandler('CLOSE','PAYMENTS_CONTAINER', function (config)
{
	CBXFORMCONTAINER.getActiveFormContainer().close();
	}
});


View the following pages

Page Tree
rootHandling Form Data Submission