Widget APIs

Owned by Ravikumar Babu CTOO (Unlicensed)
Last updated: Aug 11, 2020 by Lakshminarayanan1 S CTOO (Unlicensed)

The following table lists the Canvas APIs for widgets (views):

APIPurpose
applyFilter(options, clearFilterFlag)The applyFilter method is intended to apply the filter to the grid records.
clearFilter()The clearFilter method is intended to clear all the filters that are applied on the grid records.
clearSelectedRows(rowIndex)The clearSelectedRows is intended to clear the selection of the specified rows in the widget.
collapse(rowIndex)The collapse method is intended to collapse the widget/row of the specified row index.
drawPolygon(location, map, isDraggable)The drawPolygon method draws polygon in the map.
expand(rowIndex)

The expand method is intended to expand the widget/row of the specified row index.

exportData(exportType, viewId, widgetId, filters, sort)

Mandatory Parameters: exportType, viewId, widgetId

Optional Parameters: filters, sort

The exportData method is intended to export the business data of the widget in the specified format.

Example 1: 

To export the data of an app by invoking a button or row click event, you can call the exportData API as shown in the following code snippet:

canvas.app.exportHandler.exportData(
		{	"exportType" : "PDF",
			"viewId" : "CT_LOAN_SUMMARY_VIEW",
			"widgetId" : "CT_LOAN_SUMMARY_WGT" //widgetId is the App ID
		});

Example 2: 

The exportData method enables you to filter and sort the business data of the grid widget during export. The following code snippet serves as a sample reference: 

canvas.app.exportHandler.exportData(
		{
			"exportType" : "PDF",
			"viewId" : "GRID_VIEW",
			"widgetId" : "GRID_WGT", //widgetId is the App ID
			"filters":
			[{
				"field" : "CARD_NO",
				"constraint" : "contains",
				"filter_text" : "7XXXXXXX7244"
			}],
			"sort":
			{
				"direction" : "ASC",
				"field":"CARD_NO"
			}
		});
extendWidgetObject(widgetId, aditionalWidgetData)The extendWidgetObject method extends the widget object for any additional changes, such as addition or appending of properties and methods to the widget.
getChildWidgetDetails()The getChildWidgetDetails method is used to get the child widget IDs and view IDs.
getCurrentPageNo()The getCurrentPageNo method is used to get current page number of the widget.
getErrorMessage()The getErrorMessage method gets the error message.
getModifiedData()The getModifiedData method is intended to get the modified data from the data store.
getPageSize()The getPageSize method is intended to get the default number of rows per page on the widget.
getRecordsCount()The getRecordsCount method is intended to get the number of records in the widget.
getSelectedRows()The getSelectedRows method is intended to get the data of the selected rows on the widget.
getState()The getState method returns the state object of the current widget.
getStyle(config)The getStyle method is intended to get the CSS class list from the row, column, cell or calendar o a widget.
getTitle()The getTitle method is intended to get the current title of the widget.
getTotalPages()The getTotalPages method is used to to get total pages of data on the widget.
getViewType()The getViewType method is intended to get the widget type.
getVisibleRecords()The getVisibleRecords method is intended to get the visible records from the data store.
getWidget(widgetId, forceReturn)The getWidget method gets the instance of the widget manager class for a particular widget ID.
hasWidgetObject(widgetId)The hasWidgetObject method is intended to check whether the instance of the widget is available in the _widgetsObjectRegistry.
hide(key, value)The hide method is intended to hide the required object, such as row, column, header or footer.
isFirstPage()The isFirstPage method is used to check if current page displayed on the widget is first or not.
isLastPage()The isLastPage method is used to check if current page displayed on the widget is last or not.
listWidgets()The listWidgets method is intended to list all the widgets.
maximizeApp()The maximizeApp method is intended to maximize the widget to fit the window size.
minimizeApp()The minimizeApp method is intended to minimize and dock the current widget.
print()The print method is intended to print the widget.
refresh()The refresh method is intended to refresh the widget.
removeMarkers()The removeMarkers method removes the markers set on the map.
removeStyle(config)The removeStyle method is intended to remove the CSS class list from row, column, cell, calendar on a widget.
resetWidgetObject()The resetWidgetObject method is intended to empty the widget registry by clearing all the instances of the widget.
restoreApp()The restoreApp method is intended to remove the widget from the dock and restore it.
setData(method,data)The setData method sets the data for iFrame widget.
setFixedHeader(height, position, noOfColumn)The setFixedHeader method sets table header as sticky.
setHeaderTemplate(dom)The setHeaderTemplate method is intended to create the header template.
setMarkers(location)The setMarkers method sets the marker on the map.
setSelectedRows(rowIndex)The setSelectedRows is intended to select the specified rows in the widget. The rowIndex parameter must be passed with an array of integers. 
setShortcutKeys(hotKey, fn, keyEvent)The setShortcutKeys method sets short cut keys for the widget.
setState()The setState method is intended to set the state to an local object.
setStyle(config)The setStyle method is intended to set the CSS class(es) to the row, column, cell or calendar on a widget.
setTitle(widgetTitle)The setTitle method is intended to set the widget's title.
setWidgetHeight(widgetHeight)The setWidgetHeight method sets the widget's height.
setWidgetObject(widgetId,widgetRendererObject)The setWidgetObject method sets the widget object for the given widget ID.
setWidgetWidth(widgetWidth)The setWidgetWidth method sets the widget's width.
show(key, value)The show method is intended to show the required object, such as row, column, help, header or footer.
showToolsAs(option)The showToolsAs method is intended to show the widget tools as a tools bar or menu.
sort(config)The sort method is intended to sort the records on a grid widget. By default, it sorts in ascending order.
updateAnnotation(id,json)The updateAnnotation method is used to update the chart annotation.
updateCellValue(columnId, rowIndex, value, tableTemplateObj)The updateView method is intended to update the cell value on the grid widget.
updateChartAnnotation(id,json)The updateChartAnnotation method updates the chart annotation.
updateStoreData(data,options)

The updateStoreData method is intended to add, update or delete business data from local store to the following widgets (app) - classic grid (simple grid), live scroll grid, live scroll grid with cache, all chart types (except gauges), organization chart, and tree.

Tree widget

Sample code snippet for adding business data to local store for Tree widget:

var wgt = ct.widgets.getWidget('TREE_WIDGETID');
var data = []
data.push(
{
	'data': 
	{
		"DATA": "VIRAT", 
		"ITEM_DESC": "C", 
		"ITEM_ID": "3", 
		"PARENT_ID": "1 ", 
		"TOTAL_COUNT": "1"
	}, 
	'children': [],
	"id" : "3", 
	"parentId" : '1'
})
wgt.updateStoreData(data, 
		{	'operation': 'ADD', 
			'callbackObject': 
			{	'SUCCESS' : function(successObject){debugger;}, 
				'FAILURE' : function(failureObject){debugger},
				'COMPLETE' : function(completeObject){debugger;} 
			}
})

Sample code snippet for updating business data to local store for Tree widget:

var wgt = ct.widgets.getWidget('TREE_WIDGETID');
var data = []
data.push(
{
	'data': 
	{
		"DATA" : "VIRAT", 
		"ITEM_DESC" : "B", 
		"ITEM_ID" : "2", 
		"PARENT_ID" : "1 ", 
		"TOTAL_COUNT" : "1"
	}, 
	'children' : [],
	"id" : "2", 
	"parentId" : '1'
})
wgt.updateStoreData(data, 
		{	'operation' : 'UPDATE', 
			'callbackObject' : 
			{	'SUCCESS' : function(successObject){debugger;}, 
				'FAILURE' : function(failureObject){debugger},
				'COMPLETE' : function(completeObject){debugger;} 
			}
})

Sample code snippet for deleting business data to local store for Tree widget:

var wgt = ct.widgets.getWidget('TREE_WIDGETID');
var data = []
data.push(
{
	'data' : 
	{
		"DATA" : "CANVAS", 
		"ITEM_DESC" : "B", 
		"ITEM_ID" : "2", 
		"PARENT_ID" : "1 ", 
		"TOTAL_COUNT": "1"
	}, 
	'children' : [],
	"id" : "2", 
	"parentId" : '1'
})
wgt.updateStoreData(data, 
		{	'operation' : 'DELETE', 
			'callbackObject' : 
			{	'SUCCESS' : function(successObject){debugger;}, 
				'FAILURE' : function(failureObject){debugger},
				'COMPLETE' : function(completeObject){debugger;} 
			}
})

Chart widget

Sample code snippet for adding business data to local store for Chart widget:

var wgt = ct.widgets.getWidget(CHART_WIDGETID);
var data=[];
data.push(
{
	"YEARS" : "2015", 
	"TOTAL_COUNT" : "1", 
	"REVENUE" : "750", 
	"PROFITS" : "9000", 
	"PRE_PROFITS" : "1009"
});
wgt.updateStoreData(data, 
		{	'operation' : 'ADD', 
			'callbackObject': 
			{	'SUCCESS' : function(successObject){debugger;}, 
				'FAILURE' : function(failureObject){debugger},
				'COMPLETE' : function(completeObject){debugger;} 
			}
});

Sample code snippet for updating business data to local store for Chart widget:

var wgt = ct.widgets.getWidget('CHART_WIDGETID');
var data=[];
data.push(
{
	"YEARS" : "2020", 
	"TOTAL_COUNT" : "1", 
	"REVENUE" : "7500", 
	"PROFITS" : "4000", 
	"PRE_PROFITS" : "1009"
});
wgt.updateStoreData(data, 
		{	'operation' : 'UPDATE', 
			'callbackObject' : 
			{	'SUCCESS' : function(successObject){debugger;}, 
				'FAILURE' : function(failureObject){debugger},
				'COMPLETE' : function(completeObject){debugger;} 
			}
});

Sample code snippet for deleting business data to local store for Chart widget:

var wgt = ct.widgets.getWidget('CHART_WIDGETID');
var data=[];
data.push(
{
	"YEARS"	: "2020", 
	"TOTAL_COUNT" : "1", 
	"REVENUE" : "7500", 
	"PROFITS" : "4000", 
	"PRE_PROFITS" : "1009"
});
wgt.updateStoreData(data, 
		{	'operation' : 'DELETE', 
			'callbackObject' : 
			{	'SUCCESS' : function(successObject){debugger;}, 
				'FAILURE' : function(failureObject){debugger},
				'COMPLETE' : function(completeObject){debugger;} 
			}
});