Scrolling HTML Table With Stationary Column Headings: Any Good Libraries Or Guides

Question

I would like to make HTML data tables that have horizontal scrolling, vertical scrolling and have the column headers stay stationary so if someone scrolls down to record #943 they can still see the names of the columns.

I Googled on a lot of solutions. I tried two of the nicer looking ones out. I ditched the first that used AJAX to get and load the table. It made my page load slowly.

The second was perfect until I tried to load tables of 1000 records or more in Internet Explorer 8. It just froze. Worked fine and fast in Firefox and Chrome. Unfortunately most of my users are Internet Explorer users.

I'm also concerned because a friend of who contacted DevExpress about a problem he had with their libraries was told that JQuery has compatibility issues with IE. Just about all of the solutions I found on the web sit on top of JQuery.

So, can anyone recommend to me a library that will let large ( 1000 or more rows ) that will keep the column headers stationary, do vertical scrolling, horizontal scrolling, have a free licensing and works well in Internet Explorer 8?

If not, I am more than open to a REALLY GOOD tutorial for rolling my own.

Answer 1

I love datatables <3. The options are virtually limitless, and the number of people using it means there is a ton of support from the community. datatables.net

Answer 2

If you're not looking for ajax loading you're not really looking for a library, you're looking for a straight HTML table (HTML doesn't freeze the browser) with a header that stays fixed. If the columns are fixed-width you can just create a headers-only table in a div with horizontal scrolling, then a div with vertical scrolling, and the data table inside that. No Javascript necessary.

I'd post a jsfiddle example but the site's throwing nginx errors right now.