Copy-Pasting Tree Data

To enable the possibility to copy/paste Tree data by the CTRL+C/CTRL+V keyboard shortcuts you should use parameter clipboard.

The parameter can have one of 3 values:

  1. 'modify' (or true. It's the default value);
  2. 'insert';
  3. 'custom'.

Each of the types has its specificity and define its behavior of copying.

Setting the desired behavior of copying

tree = new webix.ui({
    view:"tree",
    ...
    clipboard:"insert"
});

Related sample:  Pasting New Items

'Modify' copying

It's the default type and can be also specified by setting the true value.

The type of copying can be characterized as in:

  • When you copy the selected node in the tree, you copy the node title (doesn't matter if it's a parent or a child node);
  • When you paste a text to the tree, it will be pasted as the title of the selected node.

Setting the 'modify' behavior of copying

tree = new webix.ui({
    view:"tree",
    ...
    clipboard:true
});

Related sample:  Pasting Items' Titles

'Insert' copying

  • When you copy the selected node in the tree, you copy the node's title (doesn't matter whether it's a parent or a child node);
  • When you paste a text to the tree, it will be added as a child item of the selected node.

Setting the 'insert' behavior of copying

tree = new webix.ui({
    view:"tree",
    ...
    clipboard:"insert"
});

Related sample:  Pasting New Items

Custom copying

The 'custom' value allows you to specify a custom logic for the paste operation.

To apply a custom 'paste' behavior to the tree:

tree = new webix.ui({
    view:"tree",
    ...
    clipboard:"custom"
});

This command will cancel the predefined behavior for the paste operation.

  • Specify custom logic in the onPaste event handler.
//the code does nothing but alerts messages
tree.attachEvent("onPaste", function(text) {
    webix.message("Node is pasted: " + text);
});

Tree invokes the onPaste event when the user presses CTRL+V keys combination.

Related sample:  Custom Clipboard Operations

Back to top