Check documentation for the latest version of dhtmlxSuite Handling Events DHTMLX Docs

Handling Events

Available Events

The following events are available in dhtmlxTree:

Drag-and-Drop Events:

  • onBeforeDrag - fires when an item's dragging starts (the item is selected and the mouse is moving);
  • onDrag - fires when an item was dragged and dropped on some other item, but before item's moving is processed;
  • onDragIn - fires when an item is dragged over some target the item can be dropped to;
  • onDrop - fires when drag-and-drop had already been processed; also fires when the nodes are moved programmatically;

Editing Events:

  • onEdit - fires on 4 different stages of editing process: before starting of editing (can be canceled), after starting of editing, before editor's closing (can be canceled), after editor's closing;
  • onBeforeCheck - fires before an item is checked/unchecked;
  • onCheck - fires immediately after an item in the tree has been checked/unchecked;

Loading Events:

  • onXLS - fires when XML parsing starts;
  • onXLE - fires when XML parsing is over, new items are already available in the tree;

Mouse Events:

  • onMouseIn - fires when the mouse pointer is hovered over an item;
  • onMouseOut - fires when the mouse pointer is moved out of an item's area;

Opening Events:

  • onOpenStart - fires right when an item in the tree starts to open, but before this item opens. This event is also available for "unclosable" nodes and nodes without the open/close functionality. In this case the result of the function will be ignored;
  • onOpenEnd - fires right when an item in the tree has become open. The event is also raised for "unclosable" nodes and nodes without the open/close functionality. In this case the result of function will be ignored.
  • onDblClick - fires right when a tree item has been double clicked, but before the default onDblClick functionality is processed;
  • onOpenDynamicEnd - fires when the openItemsDynamic() method loads and opens the required hierarchy of items;

Right Click Events

  • onRightClick- fires when the user clicks the right mouse button;
  • onBeforeContextMenu - fires before the moment a context menu appears by a right mouse click;

Selection Events

  • onClick - fires when the text part of a tree item was clicked, but after the default onClick functionality has been processed;
  • onSelect - fires when the selection in the tree was changed.

Attaching/Removing Event Handlers

The user can add any user-defined handler to available events. To do this he can use the attachEvent() method with the following parameters:

  • evName - name of the event;
  • evHandler - a user-defined event handler.
tree.attachEvent(evName, evHandler);

Several handlers can be attached to one and the same event, and all of them will be executed.

The names of events are case-insensitive.

There is a simple way of removing an event-handler:

tree.detachEvent(id); // unique id of the event handler

Related sample:  Event handlers

Back to top