Home > database >  How to perform own action on F5 key press in UI5?
How to perform own action on F5 key press in UI5?

Time:11-02

I don't know how to replace the F5 key action in SAPUI5.

I have a button "Refresh" which is reloading my business data in the UI and made some kind of manipulation before showing it on the view. I want to catch the F5-press so that my method to refresh can be called.

CodePudding user response:

Just add an event listener to the window and call preventDefault() to stop it from doing the default thing of reloading

(after running, click inside the white section to see it working. otherwise the page will reload)

window.addEventListener("keydown", (event) => {
  if (event.key == "F5") e.preventDefault();
});
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response:

Since UI5 1.70 (commit:59b83bf), applications can define app-wide shortcuts in manifest.json and declare the corresponding event handlers in the view.

Here is a sample: https://embed.plnkr.co/NKOfisfY7w0MOiX8?show=manifest.json,view/App.view.xml,controller/App.controller.js,preview&autoCloseSidebar

In manifest.json:

"sap.ui5": {
  "commands": {
    "MyRefresh": {
      "shortcut": "F5"
    }

In the view:

<AnyUI5Control>
  <dependents>
    <core:CommandExecution xmlns:core="sap.ui.core"
      command="MyRefresh"
      execute=".onRefreshData"
    />
  </dependents>
</AnyUI5Control>

When the control has the focus, pressing F5 will trigger the event handler onRefreshData in the controller.


Please note that the shortcut feature in UI5 is supported only:

  • Related