We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to detect copy/cut-paste events on Diagram

I want to perform some operations at the time of copy/cut-paste the shapes in the diagram. Is there any way to capture the events something like:

copy: (args) => { 
console.log('Item is copied!');
}, paste: (args) => {
console.log('Item is pasted!');
}

1 Reply

BM Balasubramanian Manikandan Syncfusion Team November 11, 2022 08:37 AM

You can use our command manager to detect keyboard commands cut, copy and paste. When you press ctrl + X for cut, ctrl + C for copy and ctrl + V for paste in keyboard, the command manager execute function is triggered and you can do your action in it. Refer the below mentioned documentation link, code example and sample.


Documentation Link :

https://ej2.syncfusion.com/vue/documentation/diagram/commands/#command-manager


Code Snippet:

        {

                name: 'customCopy',

                parameter: 'node',

               

                canExecute: function() {

                  let diagram = document.getElementById("diagram");

                  diagram = diagram.ej2_instances[0];

                    if (diagram.selectedItems.nodes.length > 0 || diagram.selectedItems.connectors.length > 0) {

                        return true;

                    }

                    return false;

                },

                execute: function() {

                  let diagram = document.getElementById("diagram");

                  diagram = diagram.ej2_instances[0];

                  diagram.copy();

                  diagram.dataBind();

                },

                gesture: {

                    key: Keys.C,

                    keyModifiers: KeyModifiers.Control

                }

            },



Loader.
Live Chat Icon For mobile
Up arrow icon