UI GRID insanely fast vertical scroll issue

Question

I used UI Grid in my project and below is a snapshot of the gridOptions variable that I used. The Problem is everything was working fine. But from past 1 or 2 weeks the vertical scroll is insanely scrolling on just a single scroll. Since multiSelect is set to true the clients are unable to check/select specific records the scrollbar scrolls insanely (this happens when user scrolls just once) and the scrollbar reaches to the bottom of the table.

Version : ui-grid - v3.2.1

this.gridOptions = {
      appScopeProvider: this,
      infiniteScrollRowsFromEnd: 20,
      enableSelectAll: true,
      multiSelect: true,
      enableColumnResizing: true,
      saveScroll: false,
      saveFocus: false,
      saveGrouping: false,
      enableFiltering: true,
      saveGroupingExpandedStates: false,
      saveTreeView: false,
      infiniteScrollDown: true,
      useExternalFiltering: false,
      useExternalSorting: false,
      enableCellEditOnFocus: false,
      enableCellEdit: false,
      enableRowSelection: true,
      enableFullRowSelection: true,
      enableGridMenu: true,
      enableSorting: true,
      exporterCsvFilename: 'ClientResults.csv',
      exporterCsvLinkElement: angular

      //sorry cant share other code

Can anyone help whats wrong.

PS: There are total 2000+ records in the table. Also this happens only in chrome and behaves normal in Firefox.

Soma

So what's exactly is the problem? Can you please make it more clear... Are you able to scroll down or the scroll is getting disabled in the container which prevents you from selecting the specific records? – Combined

When the user scrolls vertically the grid starts scrolling very fast even if the user scrolled just once and the scrollbar reaches the bottom of the table. This does not allows the user to select or view the in between records. – Soma

Possible duplicate of Angular UI Grid Scroll Error – Weighin

Answer 1

Got the issue.

The issue was with the version of Chrome 56. Also my ui-grid version was 3.2.0 which I upgraded to 4.0.2 which ultimately solved the issue. This Link helped.

Soma

Answer 2

For anyone wondering how to solve this without upgrading ui-grid, this fixed my issue on ui-grid 3.1.1:

Add this to your css:

.ui-grid-viewport {
    overflow-anchor: none;
}

_Source

October