Development started on Fixed Header Table jQuery plugin

Why?

The development of Fixed Header Table (its a working title) came about when I had to re implement tables that display enormous amounts of data with the following requirements: fixed header; only the table body would scroll if there were enough rows; the table would resize with the window to maximize space and usability for those with larger monitors; fixed footer to display pagination and export links for pdf/excel.

With the Fixed Header Table plugin implementing fixed header tables in HTML has never been easier.

How it works?

Using this plugin is very simple. All that is needed is a properly formatted (single) table with a thead and tbody. Fixed Header Table will do the rest for you. It even works with libraries like displayTag. If you are using a library to generate a table (e.g. displayTag) all that is required is the generated source code be valid table elements that include thead and tbody and that your table has the class “fht_table”. Read more in documentation

What not to do?

Previously I had implemented a very ugly and sloppy method of fixed headers with scrolling content. This method used two fully populated tables with identical data. The first table would be placed in a div that had the same height as the thead and overflow:hidden. The second table would be placed in a div that had a height of the window and overflow:hidden that contained the second table. The trick with the second table was to set a negative top margin equal to that of the header as to hide the header from view. The reason why visibility:collapse wasn’t used is simply because it isn’t supported in any browser except Firefox. Display:none can not be used either because then the layout of the table changes. Visibility:hidden can not be used because the content of the row is hidden from view but the space allocated for it is not so you end up with empty gaps in your tables. This is hardly a solution for having fixed headers on a table because you run into serious performance issues especially when dealing with huge amounts of data. Not to mention it is also very difficult to maintain for the author and other developers working on the same project.

Another solution is to not use tables at all but my opinion is that tabular data belong in tables.

When?

The development of Fixed Header Table began Wednesday September 30th, 2009.