Hotkeys like the demo?

Developers
1

Hi again :smile:

I’m trying to figure out how to bind commands to some keys, like the demo (demo.bpmn.io). This is, I want to bind del key to delete function, ctrl+z, and those functions.

Is there any way to do it out of the box? or is more a custom development over the library?

Thanks!
Cristian

2

Checkout the Keyboard service that handles event registration and so forth.

You can automatically activate it by passing a keyboard.bindTo=DOMElement configuration property to BpmnJS:

var modeler = new BpmnJS({ keyboard: { bindTo: document }, ... });

Manual activation/deactivation works, too:

modeler.get('keyboard').bind(document);
modeler.get('keyboard').unbind();
5 Likes
3

Hi Nikku,
when i was use to work on
var modeler = new BpmnJS({ keyboard: { bindTo: document }});
i got javascript error 'Uncaught ReferenceError: BpmnJS is not defined ’

Thanks,
Pradeep B

4

You need to correctly include the library inside your web application. See bpmn-js-seed for one example how this can be done.

5

Hi Nikku,
Actually that BpmnJS library was missing,i need that library,and how can i activate keyboard elements

Thanks
Pradeep B