beforeScrollRender hook?

Questions
1

I have something I want to do when users scroll the grid (vertically) but before the rendering cycle begins. (I would need some way of knowing what rows were about to be rendered.) Is there already a way to do that?

Thanks.

2

Hi @dhaber , Yes, Handsontable provides the beforeViewRender hook, which is triggered before the rendering cycle begins.

This hook allows you to act on the grid before the rows are rendered. It provides access to the viewportRows parameter, which contains the indexes of rows that are about to be rendered. You can use this to determine what rows are about to be displayed and execute your custom logic accordingly.

Here’s an example of how to use the beforeViewRender hook:

const hot = new Handsontable(container, {
  data: [
    ['Tesla', 2017, 'black', 'black'],
    ['Nissan', 2018, 'blue', 'blue'],
    ['Chrysler', 2019, 'yellow', 'black'],
    ['Volvo', 2020, 'yellow', 'gray'],
  ],
  colHeaders: true,
  rowHeaders: true,
  height: 'auto',
  beforeViewRender(isHotRendering, viewportRows) {
    console.log('Rows about to be rendered:', viewportRows);
    // Add your custom logic here
  },
  licenseKey: 'non-commercial-and-evaluation',
});

In this example, viewportRows will give you the indexes of rows that are about to be rendered, allowing you to act on them before the rendering cycle starts.

3

Thank you very much @joseph.petty, not sure how I didn’t find that hook!
FYI, the second parameter to the callback to that hook is skipRender (as per your documentation here). Fortunately, it seems I can leverage getFirstRenderedVisibleRow() and getLastRenderedVisibleRow() to get the rows that are about to be rendered.

Thank you again,

David

1 Like