MODx.tree.Tree
Last updated Apr 30th, 2019 | Page history | Improve this page | Report an issue
Support the team building MODX with a monthly donation.
The budget raised through OpenCollective is transparent, including payouts, and any contributor can apply to be paid for their work on MODX.
Backers
Budget
$301 per month—let's make that $500!
Learn moreMODx.tree.Tree¶
Extends: Ext.tree.TreePanel Key Features: Remotely-loaded toolbars; drag-and-drop to form fields functionality; connector functionality for removing and dragging/sorting.
Trees provide a quick and easy way to display multiple levels of objects which have a parent-child relationship, such as users or resources.
Unique Parameters¶
MODx.tree.Tree has a few extra parameters not found in Ext.tree.TreePanel objects:
Name | Description | Default |
---|---|---|
url | The URL to point the tree loader at. Optional if you pass in the data parameter. | |
rootName | The text of the root node, if rootVisible is set to true. | |
rootId | The ID of the root node. | root |
data | Optional; if url is not set, data must be loaded in through here. | [] |
remoteToolbar | If true, will load the tree's toolbar via data loaded remotely. | false |
remoteToolbarUrl* | The connector URL to load the toolbar from. Defaults to the tree's URL. | |
remoteToolbarAction* | The processor action to load the toolbar from. | getToolbar |
useDefaultToolbar | If remoteToolbar is false, this will load the default toolbar, which contains expand all, contract all, and refresh. Items passed to tbar property will be added after. | false |
menuConfig | The config object to pass to the context menu loaded for this tree. | |
expandFirst | If true, will expand the first level nodes on render. | true |
removeAction* | The processor action to take when removing a node. | remove |
removeTitle* | The title for the remove dialog when removing a node. | Warning! |
primaryKey | The primary key for the node. Usually is id. | id |
sortAction | The processor action to take when sorting nodes via drag/drop. | sort |
toolbarItemCls* | The CSS class to add to remoteToolbar loaded items. | x-btn-icon |
- = MODX Revolution 2.1+ Only
Custom Events¶
The custom events fired by MODx.tree.Tree are:
Name | Description |
---|---|
beforeSort | Fired before the tree sends off the sorted nodes to the sort processor. Passed the sorted nodes, encoded. |
afterSort | Fired after the tree node sorting happens. Passes: - event - The drop event |
- result - The response object from the sort processor. |
Other Unique Features¶
Sorting¶
Sorting is automatically enabled by default in MODx.tree.Tree objects. To disable, set enableDD to false in your config. After a drag/drop, the tree will fire off the encoded nodes to a sort processor, with the same connector as the tree URL.
Remote Toolbar Loading¶
Toolbars can be loaded remotely, using the remoteToolbar config parameter. This will load the data from a processor loaded by the remoteToolbarAction config var, which defaults to "getToolbar".
Drag/Drop to MODx.FormPanel Fields¶
Nodes can be dragged into MODx.FormPanel fields, assuming that the following is passed into the config var:
,enableDD: true
,ddGroup: 'modx-treedrop-dd'
and that the node has an attribute of 'type', which is one of the following values: modResource,snippet,chunk,tv,file.
See Also¶
- MODExt MODx Object
- MODExt Tutorials
- MODx.combo.ComboBox
- MODx.Console
- MODx.FormPanel
- MODx.grid.Grid
- MODx.grid.LocalGrid
- MODx.msg
- MODx.tree.Tree
- MODx.Window
Support the team building MODX with a monthly donation.
The budget raised through OpenCollective is transparent, including payouts, and any contributor can apply to be paid for their work on MODX.
Backers
Budget
$301 per month—let's make that $500!
Learn more