DBTreeview

(part of package 'Servoy Extra Components') Extends designtime/SolutionModel: JSWebComponent Extends runtime: RuntimeWebComponent

This is a reference page; many components have detailed usage guides here.

Properties

allowDrag

Can be used to enable dragging of nodes. Can either be a boolean value or a clientfunction that is executed in browser. Default value is false.

Type: Object


allowDrop

Can be used to enable dropping of nodes. Can either be a boolean value or a clientfunction that is executed in browser. Default value is false.

Type: Object


autoRefresh

If true, component listens to foundset changes and updates itself while visible.

Type: Boolean Default Value: true


enabled

Type: Boolean Default Value: true


responsiveHeight

Height of the treeview, set only in responsive forms.

Type: Number Default Value: 0


showLoadingIndicator

Type: Boolean Default Value: true


styleClass

Type: Styleclass


visible

Type: Boolean Default Value: true


Events

onDrop(sourceNodePkPath,targetNodePkPath,indexInParent,event)

Called when a node is dropped as a result of a drag-n-drop

Parameters:


onReady(event)

Parameters:


API

addRoots(root)

Add foundset to the list of foundsets used to create the tree's root nodes.

Example:

myElement.addRoots(foundset);

Parameters:

  • {Foundsetref} root The foundset reference to be added as a root node in the tree structure.


createRelationInfo(label,nRelationName)

Create relation info object used to set multiple child relations for a tree node

Parameters:

  • {String} label The label for the relation, typically used as the display name for the tree node.

  • {String} nRelationName The name of the relation used to define the child relations for the tree node.

Returns: CustomType<servoyextra-dbtreeview.relationInfo> An object containing the relation information for setting child relations in the tree structure.


getCheckBoxValues(datasource)

Returns array of pk of nodes that are checked for the datasource

Example:

var arrayPkChecked = myElement.getCheckBoxValues(databaseManager.getDataSource('example_data', 'categories'));

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the checked nodes' primary keys are retrieved.

Returns: Array<String> An array of primary keys of the nodes that are checked for the specified datasource.


getSelectionPath()

Returns the path of the currently selected node in the tree.

Example:

var selection = myElement.getSelectionPath();
// selection might be an array like: [{ id: 1, name: 'Root' }, { id: 2, name: 'Child' }]

Returns: Array<Object> An array representing the path of the selected node in the tree.


isNodeExpanded(pk)

Returns expand state of a node.

Example:

var expanded = myElement.isNodeExpanded([22])

Parameters:

Returns: Boolean True if the specified node is expanded, false if it is collapsed.


refresh()

Refresh the tree display.

Example:

myElement.refresh()

removeAllRoots()

Clears all foundset roots of the tree.

Example:

myElement.removeAllRoots();

setActionsCallBack(actions)

Set callback info for specific actions.

Example:

myElement.setActionsCallBack([[datasource, function1, arg1, element1], [datasource, function2, arg2, element2]]);

Parameters:

  • {Array<action>} actions An array of action objects, each defining a datasource, a callback function, its arguments, and the associated tree element for which the action should be triggered.


setCallBackInfo(datasource,callbackfunction,param)

Set callback info for a datasource foundset display.

Example:

myElement.setCallBackInfo(databaseManager.getDataSource('example_data', 'categories'),'myfunction','arg');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset to be displayed.

  • {Function} callbackfunction Callback function name

  • {String} param The parameter to pass to the callback function when it is invoked.


setCheckBoxAutoselectsChildren(datasource,autoselect)

Set the nodes whose checkbox will automatically autoselect children.

Example:

myElement.setCheckBoxAutoselectsChildren(databaseManager.getDataSource('example_data', 'categories'),false);

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the checkbox behavior is set.

  • {Boolean} autoselect A boolean value indicating whether the checkboxes should automatically select or deselect child nodes when a parent node is selected.


setCheckBoxValueDataprovider(datasource,checkboxvaluedataprovider)

Set dataprovider for the checkbox displayed for a datasource foundset.

Example:

myElement.setCheckBoxValueDataprovider(databaseManager.getDataSource('example_data', 'categories'),'enabled');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the checkbox value dataprovider is being set.

  • {String} checkboxvaluedataprovider Dataprovider of the displayed checkbox


setChildSortDataprovider(datasource,childsortdataprovider)

Set the dataprovider name to retrieve column name and sort order for the child nodes. The provided data must be a string of form : column_name_used_for_sort sort_order(asc or desc)

Example:

myElement.setChildSortDataprovider(databaseManager.getDataSource('example_data', 'companies'),'company_sort');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the child nodes' sort dataprovider is being set.

  • {String} childsortdataprovider Dataprovider of the sort text


setExpandNode(pk,state)

Sets expand state of a node.

Example:

myElement.setExpandNode([22],true)

Parameters:


setHasCheckBoxDataprovider(datasource,hascheckboxdataprovider)

Set relation for displaying a datasource foundset.

Example:

myElement.setNRelationName(databaseManager.getDataSource('example_data', 'categories'),'companies_to_categories');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the checkbox dataprovider is being set.

  • {String} hascheckboxdataprovider Relation name


setHasCheckBoxValue(datasource,pks)

Set the nodes that should have checkbox for a datasource when no hascheckboxdataprovider is used

Example:

myElement.setHasCheckBoxValue(databaseManager.getDataSource('example_data', 'categories'),["1", "3", "5"]);

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the checkboxes should be applied.

  • {Array<string>} pks Array of primary keys that should have a checkbox associated with them.


setImageURLDataprovider(datasource,imageurldataprovider)

Set dataprovider for the image displayed in tree node for a datasource foundset.

Example:

myElement.setImageURLDataprovider(databaseManager.getDataSource('example_data', 'categories'),'mymedia');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the image dataprovider is being set.

  • {String} imageurldataprovider The dataprovider that specifies the URL or path to the image displayed in the tree node.


setInitialCheckBoxValues(datasource,pks)

Set intial checked checkboxes for a datasource foundset when no checkboxdataprovider is used

Example:

myElement.setInitialCheckBoxValues(databaseManager.getDataSource('example_data', 'categories'),["1", "3", "5"]);

Parameters:

  • {String} datasource The datasource identifier, representing the foundset where checkboxes are applied.

  • {Array<string>} pks Array of pks that should have the checkbox checked


setMethodToCallOnCheckBoxChange(datasource,callbackfunction,param)

Set callback info for a datasource foundset checkbox display.

Example:

myElement.setMethodToCallOnCheckBoxChange(databaseManager.getDataSource('example_data', 'categories'),'myfunction','arg');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the checkbox change callback is being set.

  • {Function} callbackfunction Callback function name

  • {String} param A parameter to be passed to the callback function when the checkbox state changes.


setMethodToCallOnDoubleClick(datasource,callbackfunction,param)

Set callback info for a datasource foundset doubleclick event.

Example:

myElement.setMethodToCallOnDoubleClick(databaseManager.getDataSource('example_data', 'categories'),'myfunction','arg');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the double-click callback is being set.

  • {Function} callbackfunction The name of the function to be invoked when a double-click event occurs on a node.

  • {String} param A parameter to be passed to the callback function during invocation.


setMethodToCallOnRightClick(datasource,callbackfunction,param)

Set callback info for a datasource foundset right click event.

Example:

myElement.setMethodToCallOnRightClick(databaseManager.getDataSource('example_data', 'categories'),'myfunction','arg');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the right-click callback is being set.

  • {Function} callbackfunction Callback function name

  • {String} param A parameter to be passed to the callback function during invocation.


setNRelationInfos(datasource,relationInfos)

Set n-relation infos (array of RelationInfo objects created using tree.createRelationInfo() for having multiple child relations for one node)

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the relations are being set.

  • {Array<relationInfo>} relationInfos An array of objects, defining multiple child relations for a single node.


setNRelationName(datasource,nrelationname)

Set relation for displaying a datasource foundset.

Example:

myElement.setNRelationName(databaseManager.getDataSource('example_data', 'categories'),'companies_to_categories');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset to be displayed using the specified relation.

  • {String} nrelationname The name of the relation used to link the datasource with its child nodes.


setNodeLevelVisible(level,visible)

Sets expanded state for a tree level. Expanding the tree may cause performance issues.

Example:

myElement.setNodeLevelVisible(2,true)

Parameters:

  • {Number} level The level of the tree to set the expanded state for.

  • {Boolean} visible A boolean indicating whether the specified tree level should be expanded (true) or collapsed (false).


setSelectionPath(pk)

Sets selection node of the tree.

Example:

myElement.setSelectionPath([22])

Parameters:


setTextDataprovider(datasource,textdataprovider)

Set dataprovider for the text displayed from a datasource foundset.

Example:

myElement.setTextDataprovider(databaseManager.getDataSource('example_data', 'categories'),'categoryname');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the text dataprovider is being set.

  • {String} textdataprovider The dataprovider that specifies the text to be displayed for each node in the tree.


setToolTipTextDataprovider(datasource,tooltiptextdataprovider)

Set dataprovider for the tooltip text displayed for a datasource foundset.

Example:

myElement.setToolTipTextDataprovider(databaseManager.getDataSource('example_data', 'categories'),'tooltip');

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the tooltip text dataprovider is being set.

  • {String} tooltiptextdataprovider Dataprovider of the displayed checkbox


updateCheckBoxValues(datasource,pks,state)

Update checkbox state for nodes

Example:

myElement.updateCheckBoxValues(databaseManager.getDataSource('example_data', 'categories'),["1", "3", "5"], true);

Parameters:

  • {String} datasource The datasource identifier, representing the foundset for which the checkbox states are being updated.

  • {Array<string>} pks Array of primary keys of the nodes for which the checkbox state should be updated.

  • {Boolean} state True to check the checkbox, false to uncheck it.


Types

action

scripting type: CustomType<servoyextra-dbtreeview.action>

binding

scripting type: CustomType<servoyextra-dbtreeview.binding>

callback

scripting type: CustomType<servoyextra-dbtreeview.callback>

levelVisibilityType

scripting type: CustomType<servoyextra-dbtreeview.levelVisibilityType>

relationInfo

scripting type: CustomType<servoyextra-dbtreeview.relationInfo>


Last updated

Was this helpful?