ag-gridag-grid-angularag-grid-reactag-grid-vue

In ag-grid how do I make the active row color change to the selected row when the keyboard is used to navigate cells

See below, when I used the keyboard arrow keys to move 1 row down, the highlighted row is still the one above it:

enter image description here

Solution

  • Pretty simple!

    Apply setSelected method after finding the row your mouse focused using onCellFocused event.

    onCellFocused : function(params) {
  params.api.getRowNode(params.rowIndex).setSelected(true);
}

    Here's the working example: https://plnkr.co/edit/L7dGwgp3xYWunOFH