Treeview is a lightweight and flexible jQuery Plugin which transforms an unordered list into an expandable and collapsible tree. It is great for unobtrusive navigation enhancements. Treeview supports both location and cookie based persistence. It has been tested in Firefox 2, IE 6 & 7, Opera 9 and Safari 3.

Requirements: Firefox 2, IE 6 & 7, Opera 9, Safari 3
Demo: http://jquery.bassistance.de/treeview/demo/
License: MIT, GPL License

• 1 Comment

In 2005 Veerle wrote an article about styling a table with CSS. After receiving so many requests Veerle decided to give in and write another tutorial called A CSS styled table version 2. Seems like a popular topic and an interesting one to share some tricks on how you can nicely style them. A CSS styled table version 2 is about the proper usage of tables, for tabular data. How you can implement them with accessibility in mind and how to make them appealing for the eye using CSS. The styling looks stunning and I think you can use it when designing tables or even forms for your websites.

Requirements: No Requirements
Demo: http://veerle.duoh.com/blog/comments/a_css_styled_table_version_2/
License: License Free

• 3 Comments

Tablecloth is lightweight, easy to use, unobtrusive way to add style and behaviour to your html table elements. By simply adding 2 lines of code to your html page you will have styled and active tables that your visitors will love. There’s absolutely no need for hardcoded class names or id’s on the tables.Tablecloth adds those automatically.

If you mouseover on a table, Tablecloth will highlight the row or column (or both) automatically. Tablecloth will also adds selected state on click. It is really useful and easy to implement. I am sure I will use it in the near future.

Requirements: No Requirements
Demo: http://cssglobe.com/lab/tablecloth/
License: License Free

• 3 Comments

Tablesorter is a jQuery plugin for turning a standard HTML table with THEAD and TBODY tags into a sortable table without page refreshes. Tablesorter can successfully parse and sort many types of data including linked data in a cell. It has many useful features including:

• Multi-column sorting
• Parsers for sorting text, URIs, integers, currency, floats, IP addresses, dates (ISO, long and short formats), time. Add your own easily
• Support for ROWSPAN and COLSPAN on TH elements
• Support secondary “hidden” sorting (e.g., maintain alphabetical sort when sorting on other criteria)
• Extensibility via widget system
• Small code size (7,4kb packed)

*** You can sort multiple columns simultaneously by holding down the shift key and clicking a second, third or even fourth column header.

Requirements: jQuery
Demo: http://tablesorter.com/
License: GPL and MIT License

• 0 Comments

We have mentioned earlier Ext is a JavaScript framework for building web applications. It has got some stunning UI components to aid your development. We can use Ext Framework to create Beautiful Ext Grid Tables easily. The tables provide the following features.

1. Expander Rows, Collapse and Forse Fit
2. Framed with Checkbox Selection and Horizontal Scrolling
3. Grid with Numbered Rows
4. Support for Panel Features such as Framing, Buttons and Toolbars

Requirements: Ext Framework
Demo: http://extjs.com/playpen/ext-2.0/examples/grid/grid3.html
License: LGPL License

• 0 Comments

Unobtrusive Table Sort Script can sort dates (dd-mm-yyyy, mm-dd-yyyy or yyyy-mm-dd formats accepted), currency values (£, $, €, ¥ and ¤), numbers/floats and plain-text (sorted in a case-insensitive manner). It also enables zebra striping the table rows and highlighting the currently sorted column. All table column s are sortable. You can implement your own sort function easily if you would like to. The table looks really nice as well.

Requirements: Modern Browsers with Javascript Enabled
Demo: http://www.frequency-decoder.com/demo/table-sort-revisited/
License: Creative Commons License

• 0 Comments

DhtmlxGrid is a Ajax-enabled JavaScript grid control that provides professional solution for representing and editing tabular data on the web. DhtmlxGrid allows easy implementation of nice looking (managed through css or predefined skins) DHTML tables with rich in-cell editing, fixed multiline headers/footers, resizable, sortable and draggable columns. Numerous event handlers let you add necessary interactivity to grid-based interfaces. Smart Rendering technology and built-in paginal output allow this data grid to work effectively with huge datasets.

Requirements: Internet Explorer 5.0+, Mozilla 1.4+, FireFox 0.9+, Safari 2.0+
Demo: http://dhtmlx.com/docs/products/dhtmlxGrid/
License: GPL License

• 3 Comments

TableKit is a collection of HTML table enhancements using the Prototype framework. TableKit currently implements row striping, column sorting by clicking on the headers, column resizing by draging the edge of the cells, and cell editing simply by double-click. All the actions are instant, no page refresh is needed.

Requirements: Any Modern
Demo: http://www.millstream.com.au/upload/code/tablekit/
License: License Free

• 0 Comments