8 Ajax Data Controls and Effects to Work with Tables

8 Ajax Data Controls and Effects to Work with Tables

Hi Dear readers, I browsed various projects that deals with HTML tables and data control. These a neat to achieve spreadsheet like experience for your users in web projects.

– Extux Livegrid

Extux Livegrid

The Ext.ux.Livegrid component is a user extension that’s build upon the Ext JS Framework and more specificaly extends Ext.grid.GridPanel. The component allows to read chunks of data from an underlying storage (common use case: a database) without the need of paging. Means: You can virtually display and scroll through a large amount of data – the grid will only render the data that comes into the viewport and will request new data for displaying if the user reached a specific cursor position/row index.

– treeTable


treeTable is a plugin for jQuery, the ‘Write Less, Do More, JavaScript Library’. With this plugin you can display a tree in a table, i.e. a directory structure or a nested list. Why not use a list, you say? Because lists are great for displaying a tree, and tables are not. Oh wait, but this plugin uses tables, doesn’t it? Yes. Why do I use a table to display a list? Because I need multiple columns to display additional data besides the tree.

– dhtmlxGrid


dhtmlxGrid is an Ajax-enabled JavaScript grid control with cutting-edge functionality, powerful data binding, and excellent performance with large datasets. The gridview component is easy-to-use and provides great flexibility due to its rich client-side API. dhtmlxGrid supports different datasources, including XML, JSON, CSV, JS array, and HTML table. Since v1.6 grid data can be loaded from custom XML format.

– Preloading Data with Ajax and JSON

Preloading Data with Ajax and JSON

An Old but extensive and still good actual that describe how to preload your data to enhance your application usability.

– FlexiGrid for jQuery

FlexiGrid for jQuery

FlexiGrid is a 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. Similar in concept with the Ext Grid only its pure jQuery love, which makes it light weight and follows the jQuery mantra of running with the least amount of configuration.

– Features:

  • Resizable columns
  • Resizable height and width
  • Sortable column headers
  • Cool theme
  • Can convert an ordinary table
  • Ability to connect to an ajax data source (XML and JSON[new])
  • Paging
  • Show/hide columns
  • Toolbar (new)
  • Search (new)
  • Accessible API
  • Many more

– YUI Library DataTable Control

The All in One great DataControl component for YUI Library. The DataTable control provides a simple yet powerful API to display screen-reader accessible tabular data on a web page. Notable features include sortable columns, pagination, scrolling, row selection, resizeable columns, and inline cell editing.

– Tablecloth


Table cloth is a great tool to ease your users browsing wide dataset by adding different colors on their precise coordinates in the table.Features :1. Lightweight, 2.Unobtrusive, 3. Configurable highlighting of rows and columns or both,4.Highlight on click, 5.Custom CSS

– jqGrid


jqGrid is a plugin fro jQuery, it supports Json, XML and Javascript Array datatypes.Features- Basic Search engine, In place data editing, Themes, SubGrids, Integration with jQuery UI Datepicker, And more, just check out the demos.

Back To Top