Inhaltsverzeichnis
Table Design
Designing HTML tables with sorting, filtering, fixed headers, zebra colour feature and so on.
Favorites
These approaches have proved most promising to me…
- www.javascripttoolbox.com – Table Sorting, Filtering, Etc.
- http://www.imaputz.com/cssStuff/bigFourVersion.html – Pure CSS Scrollable Table with Fixed Header. Using CSS to allow scrolling within a single HTML table
- http://www.imaputz.com/cssStuff/bulletVersion.html – (Almost) Pure CSS Scrollable Table with Fixed Header. The Bullet Resistant Version. Probably the most often referenced solution in the WWW.
Examples
- www.kollermedia.at -25 Sortable Table Scripts
- www.onsemi.com provide a most sophisticated table example.
Tutorials
- Imar.Spaanjaars.Com – A Scrollable Table With a Fixed Header
- SSI-Developer.net – CSS Guides: Non-scrolling table header
- Super Tables – HTML Tables with Fixed Headers and More.
Many plain HTML/CSS approaches suffer from the need to have a fixed width specified to the columns.
However using automatic width will result in column width running out of sync for header and body.
Libraries
- TableFilter – A Javascript library making HTML tables filterable
- www.datatables.net – DataTables is a plug-in for the jQuery Javascript library which will add advanced interaction controls to any HTML table.
- www.activewidgets.com – A comercial CSS/JS/AJAX library solution. Also with sortable columns!
Want to know how to resize fixed rowheader with the mouse? Look here.
- www.dhtmlx.com
AJAX powered editable DHTML JavaScript Grid. Heavy CSS/JS/AJAX library suitable for handling large tables up to ten thousands of rows.
Tips and Tricks
- Navigating a Table – The Document Object Model (DOM)
