How do I fix the headers in the NonFactors.Grid.Mvc6 grid?

Question

I'm using the NonFactors.Grid.Mvc6 grid component in my .NET Core 6 web application. It's working well and has coped with everything I've thrown at it so far.

https://aspnet-core-grid.azurewebsites.net/

Now my client has asked for sticky headers, so that the column names and filters don't scroll off the page when scrolling down the rows. It's a common feature and tweak to pretty much every web grid out there.

I've tried several CSS tweaks and hacks, but nothing works correctly.

Recent release notes for the component suggest it's a built in feature:

But even after trawling through the code I can't see if it's an option anywhere.

Has anyone managed to implement this feature in this particular grid component?

Answer 1

I eventually managed to find a solution so in a massive break with internet tradition, I'll post it here so others with the same issue can see how.

In the end it was as simple as using this plugin which worked out of the box.

StickyTableHeaders

At time of writing it's been 6 six years since it's last update, but if it ain't broke, don't fix it.