Oracle APEX Tutorial

Excel-Style Keyboard Shortcuts
in Interactive Grid

Add Alt+A, Alt+D, Alt+S and Alt+R to your editable IG : no plugins, just four clean setup steps using APEX's built-in actions registry.

Alt+A  Add Row

Alt+D  Delete Row

Alt+S  Save

Alt+R  Refresh

Alt+Shift+F1  View All Shortcuts

Live Demo GitHub Code

Editable IG

Static ID

Cursor Focus

JS Init Code

Testing

1

Prerequisites : Make your IG Editable

⚠️ Keyboard shortcuts only work on an Editable Interactive Grid. The row-add-row, row-delete, and save actions only exist in the IG's action registry when the grid is in editable mode. If you skip this, actions.lookup() will return null and throw an error.

In your Interactive Grid region's attributes, set Edit → Enabled to Yes. Read-only IGs won't have row-add or row-delete actions registered : the shortcuts will silently fail.

2

Give Your IG a Static ID

In Page Designer, click your Interactive Grid region. In the Property Editor go to Advanced → Static ID and enter a unique identifier.

LocationIG Region → Properties → Advanced → Static ID

Example valueemp_grid

Required?Not strictly for shortcuts, but essential for any external JS or Dynamic Actions referencing this grid

💡 Always set a Static ID : it's good practice and makes debugging, Dynamic Actions, and future JS references far easier.

3

Set Cursor Focus to IG on Page Load

Without this, users must click inside the grid first before shortcuts respond. Setting cursor focus means the IG captures keyboard input right on load : just like Excel opens ready to type.

Click the Page node (the root of the page, not a region) in the Rendering tree, then in the Property Editor:

LocationPage node → Property Editor

Property pathPage → Navigation → Cursor Focus

Set toFirst item on page

4

Add JavaScript Initialization Code

This is the core step. Click your Interactive Grid region → go to the Attributes tab → scroll to the Advanced section → find JavaScript Initialization Code. Paste the code below:

⌨️ The core mechanism is actions.lookup("action-name").shortcut = "Alt+X" followed by actions.update("action-name"). The update call is mandatory : without it, APEX doesn't register the shortcut change.

JavaScript

function( options ) {

  options.defaultGridViewOptions = {
    skipReadonlyCells: true   
  };

  options.initActions = function( actions ) {

    function setShortcut( names, shortcut ) {
      var names = Array.isArray(names) ? names : [names];
      for (var i = 0; i < names.length; i++) {
        var act = actions.lookup( names[i] );
        if ( act ) {
          act.shortcut = shortcut;
          actions.update( names[i] );
          break;
        }
      }
    }

    setShortcut( ["row-add-row", "selection-add-row"], "Alt+A" );

    setShortcut( ["row-delete", "selection-delete"], "Alt+D" );

    setShortcut( ["save"], "Alt+S" );

    setShortcut( ["refresh"], "Alt+R" );

  };

  return options;
}

Here's a quick reference of all shortcuts registered by the code above:

Shortcut	Action	APEX Action Name	Excel Equivalent
Alt + A	Add a new row	row-add-row	Insert row
Alt + D	Delete selected row	row-delete	Delete row
Alt + S	Save changes	save	Ctrl+S
Alt + R	Refresh the grid	refresh	F5 / Refresh
Alt + Shift + F1	View all keyboard shortcuts	Built-in APEX shortcut	:

5

Testing Your Shortcuts

Run your page and click inside the Interactive Grid. Use the built-in APEX shortcut viewer to confirm your custom shortcuts are registered correctly.

✅ Press Alt + Shift + F1 on the page to see a popup of all active keyboard shortcuts : your custom ones will appear there automatically alongside APEX's built-in shortcuts.

View shortcutsPress Alt+Shift+F1 on the running page

Shortcut not firing?Check if IG is Editable and that actions.update() is called after setting the shortcut

Console error?Verify action names : use the Array.isArray helper which tries multiple names safely

How it works

Editable mode is required because row-add-row, row-delete, and save actions are only registered in APEX's actions registry when the IG is editable. Calling actions.lookup() on a read-only grid returns null.

The setShortcut helper accepts an array of possible action names : useful because APEX uses different names depending on the IG view mode (row vs selection). It tries each name and stops at the first match, preventing crashes.

actions.update() is mandatory. Setting act.shortcut alone just mutates the object in memory. Calling actions.update(name) tells APEX to re-register and bind the keyboard event listener : skipping it means the shortcut never fires.

skipReadonlyCells: true makes Tab navigation jump over display-only columns, exactly like Excel skips locked cells. This makes data entry feel natural and keyboard-friendly.

Cursor focus on page load means the IG is already focused when the page opens. Without it, the user must click the grid before any shortcut responds : a friction point that breaks the Excel-like feel.

Step-by-step summary

Step 1

Make IG Editable

Set Edit → Enabled = Yes. Actions like row-add-row only exist in editable mode.

Step 2

Set a Static ID

Not strictly required for shortcuts, but essential for external JS references and Dynamic Actions.

Step 3

Set Cursor Focus

Page → Navigation → Cursor Focus = First item on page. Shortcuts work immediately on load.

Step 4

Paste JS Init Code

IG Region → Attributes → Advanced → JavaScript Initialization Code. This is the core wiring.

Step 5

Verify with Alt+Shift+F1

Use APEX's built-in shortcut viewer to confirm all four shortcuts appear correctly.

Quick Checklist

Set your Interactive Grid to Editable mode (Edit → Enabled = Yes)

Give the IG region a Static ID via Properties → Advanced → Static ID

Set Page → Navigation → Cursor Focus to First item on page

Paste the JS Init Code into IG Region → Attributes → Advanced → JavaScript Initialization Code

Test with Alt+Shift+F1 to confirm all four shortcuts are registered

Built with Oracle APEX Interactive Grid

Oracle APEX JavaScript Keyboard Shortcuts Interactive Grid UX