20 jQuery Table Plugins

jQuery is the “Write Less, Do More”, JavaScript Library, which off shoulders your coding and work load to a a great extent. Developers love jQuery from the core of their heart and developing and jQuery appears inseparable.

Well who doesn’t want effective and impressive results with lesser work. jQuery has strengthened the hands of developers in most of the aspects of web designing, and Tables are one of the important aspect.

jQuery let you to create stylus and flexible tables with its magnificent Plugins. In this post you will get a peek a boo of 20 jQuery Table Plugins that are among the best of the lot. These plugins help you to create superb tables which are easy to code for you and easy to understand for your readers. Thus both the sides are equally happy. Lets have a look on these jQuery Table Plugins.

If you like this article, you might be interested in some of our older articles on jQuery Tooltip, jQuery Slideshow, jQuery Dropdown, and Is jQuery Really Capable of Replacing Flash?

Collapser

Jquery collapser is a multi purpose collapser plugin made for expanding and collapsing elements. Can create a accordion, list collapser using this plugin.

Collapser

More Information On Collapser

jExpand

jExpand is ultra lightweight jQuery plugin that will make your tables expandable. Typical for line of business applications, this feature can help you organize tables better. This way, tables can hold more information such as images, lists, diagrams and other elements.

jExpand

More Information On jExpand

Fixed Header Tables

Fixed Header Tables takes valid table HTML and builds a fixed header as done in Microsoft excel and a scrolling body with optional footer.

Fixed Header Tables

More Information On Fixed Header Tables

treeTable

The treeTable plugin allows you to display a tree in a table, i.e. a directory structure or a nested list. Each branch in this tree can be collapsed and expanded, just like in a file explorer in most modern operating systems.

treeTable

More Information On treeTable

Flexigrid

Lightweight but rich data grid with resizable columns and a scrolling data to match the headers, plus an ability to connect to an xml based data source using Ajax to load the content.

Flexigrid

More Information On Flexigrid

Table Drag and Drop

This TableDnD plugin allows the user to reorder rows within a table, for example if they represent an ordered list. Individual rows can be marked as non-draggable and/or non-droppable. Rows can have as many cells as necessary and the cells can contain form elements.

Table Drag and Drop

More Information On Table Drag and Drop

BI Grid

BI Grid is designed to present your data, especially in the reports for enterprises. It would be able to edit data easily, drill down to details easily and ajax enabled.

BI Grid

More Information On BI Grid

jQuery charToTable plugin

With this plugin you can convert characters to tables using jQuery.

jQuery charToTable plugin

More Information On jQuery charToTable plugin

Alternate Plugin

Assign alternating class names to selected elements to allow CSS assignment of colors or other styles of your choice. Excellent plugin for alternating row colors in tables! As a bonus, it will assign a “hover” class to elements if you set hover:true

Alternate Plugin

More Information On Alternate Plugin

Add Table Rows Count

This plugin automatically adds a column with row count. Thus making your tables more readable and keeping your markup/metadata clean.

Add Table Rows Count

More Information On Add Table Rows Count

Chromatable JQuery Plugin

jQuery plugin that creates either a resizable table or a scrollable table with a fixed position header, (the header will stay put while you scroll down the table content). It allows the user to define the table dimensions as a fixed pixel amount, auto, or 100%.

Chromatable JQuery Plugin

More Information On Chromatable JQuery Plugin

Animated table sort

This plugin allows you to animatedly sort a table based on a column’s td’s, or on the content/value of a child/descendant element within those td’s. The various td’s fly to their new homes, giving a nice effect. It also supports sorting on REGEXP matches.

Animated table sort

More Information On Animated table sort

ColdFusion Query to Table

Create a dynamic Table from a ColdFusion Query Json. Or a JavaScript Array

ColdFusion Query to Table

More Information On ColdFusion Query to Table

Table Pagination

This jquery plugin is used to create a pagination element under a table element. You can customize your pagination needs through various settings.

Table Pagination

More Information On Table Pagination

DataTables

DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, based upon the foundations of progressive enhancement, which will add advanced interaction controls to any HTML table.

DataTables

More Information On DataTables

Tablesorter

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.

Tablesorter

More Information On Tablesorter

uiTableFilter

uiTableFilter is a jquery plugin for filtering table rows.

uiTableFilter

More Information On uiTableFilter

columnManager

A jQuery-plugin to toggle the visibility of table columns (collapsing and expanding them) and to save the state until the next visit. It’s supporting tables with colspans and rowspans, too

columnManager

More Information On columnManager

Ingrid

Ingrid is an unobtrusive jQuery component that adds datagrid behaviors (column resizing, paging, sorting, row and column styling, and more) to your tables.

Ingrid

More Information On Ingrid

columnHover

A jQuery-plugin that highlights whole columns in a table when hovering over them. It’s supporting tables with colspans and rowspans, too.

columnHover

More Information On columnHover

Sharing is Caring
Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

Comment Rules

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i><q cite=""> <strike> <strong>

Kindly use a valid Name and Email address. Spam or unrelated comments will be deleted

If you are a regular commenter, be sure to check our Comment Contest.