jquery-ui-table

The jQuery UI table widget enables a host of features for plain tables in HTML documents.

At a minimum, the widget provides the ever elusive, yet simple, y axis scrolling for tbody, allowing stationary header and footer. Column widths are maintained between all table elements, even with the scrollbar present. Column headers can be made resizable allowing users to adjust widths to their preference. Complementing resizable headers, is x axis scrolling, which enables users to enlarge columns beyond the table width boundary.

Full feature list:

• X and Y axis scrolling with stationary header and footer.
• Resizable headers.
• Specify minimum, maximum, and initial widths for table columns.
• Various option formats are accepted: single value, array, and function.
• Increase header widths during resize beyond apparent table width.
• Synchronized scrolling of header and footer with the x-axis scrollbar.
• Limit total minimum column widths to apparent table size during resize.
• Resize function provided for dynamic and fluid layout.
• Destroy completely restores the table to its initial state.

Live Examples

Below are various examples of the widget in action on an autogenerated table. Be sure to change the window size to see the dynamic resizing functionality that can be acheived with minimal effort from this plugin. (Thanks to MarcJ for the CSS Element Queries plugin which made this possible.)

Limitations

Effective minimums should be provided in the configuration as column widths between the header and body will unsynchronize when either the header column pack size or the body column pack size is reach.

Known Issues

There are no known issues at this time.

License

MIT License. Copyright 2014, Anthony Wells.