Data Tree

Data tree represents a hierarchical view of information, where each item can have a number of subitems.
  • data-field-child - define ParentID field from selected data source.
  • data-field-parent - define ID field from selected data source.
  • data-field-display - data field tree element name to display.
  • data-field-has-children - has children bit field from data source. If it is set to 1, then it means that node has children and you can expand files.
  • data-expandtolevel - tree expanding level number.
  • data-icon-default - default class icon for tree elements.
  • data-menu - data tree element is read only, but you can create dropdown menu for node to delete, rename, download, etc.
  • data-upload-target - is using to upload context (which sets up drag and drop area).
  • data-item-tooltip - is using to display information in conjunction with the cursor or mouse pointer.

Required columns

The mandatory columns for view are: ParentID (empty fields needs to have NULL value), NodeID, Name and HasChildren.
Fields structure: Name: January.pdf, ParentID: Reports, NodeID: Reports\January.pdf, HasChildren: 0. Folders also have to be defined in the view.


  • attachEvent('onNodeClicked') - will fire when node is selected.
  • attachEvent('onNodeDropped')/attachEvent('onContentDropped')/attachEvent('onFilesDropped') - will fire when node/content/file is uploaded on button click or dragged into selected area.
  • attachEvent('onNodeCreated') - will fire when node are created: on page load and when level is expanded.
  • attachEvent('onNodeRefreshed') - will fire on page load.
  • attachEvent('onNodePasted') - will fire when node is pasted.


  • myTree.inlineEditCurrentNode(pCallback) - use to make an active node editable. Callback is invoked after user has finished editing. An object is passed to callback as parameter, which has newValue, row and node properties. If callback returns false, previous value is shown.


Related articles