Excel-Like jQuery Data Table Plugin - xTab

File Size: 5.62 KB
Views Total: 18241
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Excel-Like jQuery Data Table Plugin - xTab

xTab is a jQuery plugin extends the standard Html table to make it behave like a Microsoft Office Excel-like spreadsheet.

See also:

Basic Usage:

1. Load the latest version of jQuery library and the jQuery xTab plugin in the document.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="xtab.js"></script>
<link rel="stylesheet" href="xtab.css"/>

2. Create an empty container element to place a data table.

<div id="demo"></div>

3. Initialize the plugin to render a spreadsheet in the container you just created.

$(document).ready(function() {
$("#demo").xtab("init", { 
rows: 10, 
cols: 20, 
collabels: true, 
rowlabels: true

4. Get the table value as an 10x20 string array.


Change logs:


  • Added col/row highlighting


  • Added col/row highlighting


  • Select on click


  • Updated select+focus


  • Added fixed width + split columns headers


  • Fixed and enhanced examples


  • Improved functions
  • Fix.

This awesome jQuery plugin is developed by cgdave. For more Advanced Usages, please check the demo page or visit the official website.