[VUE 3] Enabling browser-based find for all grid row data.

[spencer]

Hello,

We noticed that in our product and in the Bryntum demos that when trying to search the page for text using browser "find" with ctrl+f it won't find text that's outside of the viewport.

I found the autoHeight: true configuration for the grid which makes it so that all of the data can be searched at the expense of performance but then the header is no longer fixed at the top of the page.

Is there a way to enable browser "find" while preserving the fixed grid header? Would the best way to be to just map ctrl+f to the Bryntum grid search feature?

Thank you

[ghulam.ghous]

Hi Spencer,

You are unable to find the text because we use virtualization while rendering rows. So the content which is outside the viewport is not rendered and is only rendered once we scroll to it. I tried setting autoHeight: true in our online demos and it worked https://bryntum.com/products/grid/examples/basic/.

You can use our grid search for this purpose. See here https://bryntum.com/products/grid/examples/search/. You can map ctrl + f to use our search by setting keyMap. See here how can you set this https://bryntum.com/products/grid/docs/guide/Grid/customization/keymap. About header not preserving, can you please share runnable test case so we can see why header is not preserved?

Regards,
Ghous

[Animal]

Auto height is a bad idea. It means all rows are rendered and the grid is just huge and non-performant.

Obviously, with a huge element, the top of it will go out of view when you scroll its containing element.

This is not how large data grids work. They are given a constrained height most likely by the CSS of the app, and they scroll their rows within that.