Block Copying
To enable copying and pasting DataGrid data by the CTRL+C/CTRL+V keyboard shortcuts you should use the clipboard parameter.
The parameter can have the following values:
- “block” (also set as true);
- “selection”;
- “repeat”;
- “custom"
Setting the desired behavior of copying
webix.grid({ clipboard:"selection",});
Related sample: Copying between Grids
"Block” Copying
Section titled “"Block” Copying”webix.grid({ clipboard:true, // or "block"});
How it works:
- If the copied area is smaller than the paste area, copied values fill cells from left to right, leaving excess cells unchanged.
- If the copied area is bigger than the paste area, copied values fill the cells in the paste area and the cells to the right and bottom of it until all values are pasted.
Related sample: 'Block' Copying
”Selection” Copying
Section titled “”Selection” Copying”webix.grid({ clipboard:"selection",});
How it works:
- If the copied area is smaller than the paste area, copied values fill cells from left to right, leaving excess cells unchanged.
- If the copied area is bigger than the paste area, copied values fill the cells only in the paste area. Excess values are not pasted anywhere.
Related sample: 'Selection' Copying
”Repeat” Copying
Section titled “”Repeat” Copying”webix.grid({ clipboard:"repeat",});
How it works:
- If the copied area is smaller than the paste area, copied values fill all cells in the paste area. Copied values are repeatedly copied into the excess cells until all of them are filled.
- If the copied area is bigger than the paste area, copied values fill the cells only in the paste area. Excess values are not pasted anywhere.
Related sample: 'Repeat' Copying
”Custom” Copying
Section titled “”Custom” Copying”“custom” clipboard allows you to specify custom logic for the copy-paste operation.
var grid = webix.grid({ clipboard:"custom", select:"row", autoConfig:true, data:grid_data});
This will cancel the predefined behavior for the paste operation. That’s why you will need to specify custom logic in the onPaste event handler. E.g.:
grid.attachEvent("onPaste", function(text) { // define your pasting logic here var sel = this.getSelectedId(true); sel.forEach(item => { this.getItem(item.row)[item.column] = "test"; this.refresh(item.row); });});
onPaste is called when the user presses CTRL+V.