ag-grid shows only few rows and gets updated with scroll but i want see all rows in DOM with scroll

user_5408426 0
Viewed 1115

My service returns 300 rows but in DOM i see only 20-30 rows in an instance and rest gets added when scrolled replace the top ones

I want all the rows initialized only once with page-load(Service is called) with all the rows returned from my service call and then i can scroll thus only dealing with static data of 300 rows

Please look at the screenshot enter image description here

ag-grid
2 Answers

Reference links:

https://www.ag-grid.com/javascript-grid-properties/#miscellaneous

https://www.ag-grid.com/javascript-grid-properties/#scrolling

Look for suppressRowVirtualisation and rowBuffer on these links. By default rowbBuffer is set to 20 by Ag-Grid, it doesn't mean it's asking your backend for a data back and forth. It just creating 20 DOM element at a time which is good for the speed. If you set rowBuffer to a bigger number then eventually your browser will freeze with so many DOM elements.

For some reason, if you still want to create all 300 rows in DOM, you can achieve by following. (As @Jarod Moser answer below.)

gridOptions = {
    ...
    rowBuffer: 300
    ...
}
user_70724680
Related