ag-grid loses focus after refresh

Question

I'm using ag-grid in Angular 4.x. Whenever the grid is refreshed it loses focus. This seems to be a bug in ag-grid.

Is there any workaround, like setting the focus back to the grid, so that keyboard navigation still functions?

Cheers, Seeschorle

Answer 1

Here is my solution:

   private bringFocusBack() {
      let cell = this.gridOptions.api.getFocusedCell();

      if ( cell ) {
         this.gridOptions.api.setFocusedCell( cell.rowIndex, cell.column );
      }
   }

Call this method after doing the refresh:

this.gridOptions.api.refreshRows( rowsToRefresh );
this.bringFocusBack();

Answer 2

Before Refreshing the grid, save the rowIndex of selectedRow

   let CellRowIndex = selectedRow.rowIndex;

After Refreshing,

     if (this.GridOptions.api != undefined ) {            
        this.GridOptions.api.selectIndex(CellRowIndex, false, false);
    }

Answer 3

Ive also been using similar solution (in react tho) to approved answer, however this may generate some bugs (that i encounter now). After grid refreshes it will force focus a cell - that is a browser level focus it seems, so if you had an input focused it will lose it. Same if you had a dropdown list opened - it might close as browser thinks that you focused/clicked cell in grid.