Why Responsive Tables?
There is no denying that HTML tables are needed to display tabular data. The problem comes in when you are looking at a large HTML table on your iPhone. If there is too much data to show, then it tries to squash it all up and once it cannot squash it any more, the table then flows outside of the page causing your site to scroll horizontally - YUCK!
Existing Solutions
There have been quite a few solutions created including :
1) Zurb’s that scrolls the table horizontally on smaller devices.
2) Dave Bushell’s that flips the table on it’s side.
3) Filament Groups’s solution lets the user select the columns to show.
4) Stewart Curry’s one hides less important columns.
5) Chris Coyier’s one which groups the data for each row in a list and the columns disappear.
Download
Get the code from Github.
What’s Next?
This is just the start of FooTable. If you look at the FooTable code you will see there is an extensible plugin framework built in. We have already written a sorting and filtering plugin that when included in the page, makes your table sortable and filterable. (These are still being tested and will be released soon).