Tech Tip: Add Keyboard Shortcuts through CUI

We've previously covered how you can utilize CUI to add custom buttons to toolbars. However, you can also take advantage of CUI to add keyboard shortcuts for more advanced users. In this blog post, we will cover how to add a shortcut to select all of the items in a grid when a user presses "Ctrl+A".

Getting Started

You can find all of the code in this blog post in the cui-shortcut project on the Aras Labs GitHub.

ArasLabs/cui-shortcut

Note: This project will should only be used with Aras 11 SP7 and later. The necessary CUI capabilities were not yet implemented in versions earlier than 11.0 SP7.

Create the Shortcut Handler

We will begin with writing the Method that will select all of the items in the grid.

  1. Create a new JavaScript method called my_mws_ctrl_a
    1. This follows the naming conventions of the other shortcuts which will make it easier to find in the future
    2. MWS stands for "Main Window Shortcut"
  2. Copy and paste the code from the editor below into this new method
  3. Save, unlock, and close the my_mws_ctrl_a method

Adding the Shortcut

  1. In the TOC, navigate to Administration > Configuration > Client Presentation and click the hyperlink highlighted below
  2. In the Command Bar Section relationship tab, search for the item below 
    • Classification: Data Model
    • Name: com.aras.innovator.cui_default.main_window_main_menu
    • Location: Main Window Main Menu
  3. Open and lock this item
  4. In the Command bar Item relationship tab, create a new item with the information below
    • ItemType: Shortcut
    • Name: my.cui.mws_ctrl_a
    • Action: Add
    • For Identity […]: World
      • This is the group of users that will be able to use this shortcut
  5. Right-click > View "Command Bar Item" to view this shortcut in a new window
  6. Fill in the following information
    • Handler: my_mws_ctrl_a
    • Shortcut: ctrl+a
  7. Save, unlock, and close this Shortcut
  8. Save, unlock, and close the Command Bar Section

You can now try out this new shortcut by selecting any ItemType in the TOC and clicking ctrl+a. You should see that all of the items in the grid are selected.

LOOKING FOR MORE ARAS INSPIRATION?

Subscribe to our blog and follow @ArasLabs on Twitter for more helpful content! You can also find our latest open-source projects and sample code on the Aras Labs GitHub page.

Anonymous
  • Hi Joe, It sounds like you're trying to open some kind of dialog when a user clicks a button in CUI. We have another blog post that covers how to open a dialog from within a client-side method which you can find at the link below. community.aras.com/.../ You can then set the Click Method property of your CUI button to this new method, so that your dialog is displayed when a user clicks this button. I hope that helps! Chris
  • hi,thanks for you share,could you tell me how to set cui button click show custom frame?now i know set cui button,but idon't how to created frame and show it.