In this post I'm going to share a way to get a fully functional hotkeys support in ADF applications.
AccessKey property has many restrictions which I don't like:
And now to register the hotkey I should only add a clientAttribute with name Accelerator to a component. The value is a key combination like Ctrl+DOM_VK_A or Ctrl+DOM_VK_A,Ctrl+DOM_VK_S (comma-separated list).
In this case an ActionEvent will be triggered when the user will press Ctrl+A or Ctrl+S. But not all components support ActionEvent and in this case script can trigger custom events. Event handler.
Sometime I need different logic to be executed depending on hotkey. To achieve this I can send different custom actions to the application server with javascript handler (or the same action with different params). Server listeners. If there is a client attribute with name AcceleratorHandler in the component with hotkey, a javascript handler will be executed when user triggers a hotkey.
Javascript method takes three arguments:
There is a performance issue when user inputs the text in the textfield. If the script will react on each keypress, it will be a senselessly work. So by default script doesn't react on key pressed when the focus is in a text field except two cases:
CommonUtils.js Hotkeys.js
AccessKey property has many restrictions which I don't like:
- it is a browser specific feature (accessKey is triggered by browser-specific and platform-specific modifier keys. It even has browser-specific meaning. For example, Internet Explorer 7.0 will set focus when you press Alt+
. Firefox 2.0 on some operating systems you press Alt+Shift+ . Firefox 2.0 on other operating systems you press Control+ ); - I can't have hotkeys like Ctrl+Space;
- I can't trigger particular events;
- I can't set several hotkeys for one component;
- and so on.
In this case an ActionEvent will be triggered when the user will press Ctrl+A or Ctrl+S. But not all components support ActionEvent and in this case script can trigger custom events. Event handler.
Sometime I need different logic to be executed depending on hotkey. To achieve this I can send different custom actions to the application server with javascript handler (or the same action with different params). Server listeners. If there is a client attribute with name AcceleratorHandler in the component with hotkey, a javascript handler will be executed when user triggers a hotkey.
Javascript method takes three arguments:
- aComponent - reference to the component for which the event is triggered;
- aAccellerator - string value which contains key combination that user has pressed;
- aEventType - a value of clientAttribute with name AcceleratorEvent if it exists.
There is a performance issue when user inputs the text in the textfield. If the script will react on each keypress, it will be a senselessly work. So by default script doesn't react on key pressed when the focus is in a text field except two cases:
- it will process only hotkeys for focused component;
- when component has a client attribute processKeydownAsHotkey with value TRUE.
CommonUtils.js Hotkeys.js
Thanks for the Excellent post!! Helped a lot.
ReplyDeleteThank it's helpful, But the sample is not available!?
ReplyDeletePlease i want the examples i didnt find them 😣
ReplyDeleteThis comment has been removed by the author.
ReplyDelete