TableEditor provides flexible in place editing of HTML tables. User defined handler functions can easily be dropped in to, for example, update the data source via an AJAX request.

Requirement

TableEditor is a jQuery plugin. It requires jQuery (1.0.3 recommended) and should be used in conjunction with Christian Bach’s TableSorter plugin. Future versions will likely function independant of TableSorter.

On table load, assign an “edit” event to all elements matching the configurable EVENT_LINK selector (by default; all table cell links of class “tsEditLink”).

When “edit” event is called;

1. Execute PRE_EDIT function (if defined)
2. Change “edit” event link to “save” event
3. Disable sorting on table
4. Make row cells editable
5. Execute POST_EDIT function (if defined)

When “save” event is called;

1. Execute PRE_SAVE function (if defined)
2. Make row cells non-editable, cache changed & original values to pass to UPDATE function
3. Clear tableSorter’s cache
4. Execute UPDATE function (if defined)

Demo: http://dev.iceburg.net/jquery/tableEditor/demo.php
Download: http://dev.iceburg.net/jquery/tableEditor/jquery.tablesorter.js
Source: http://dev.iceburg.net/jquery/tableEditor/demo.php

Related Listings:

1. KeyTable – jQuery Table Plugin KeyTable is a Javascript library which provides keyboard navigation and...
2. Table Sorter 2.0 tablesorter is a jQuery plugin for turning a standard...
3. Drag and drop table content with JavaScript With few lines of JavaScript, you can drag and drop...
4. Table Gear – Moo Tools Plugin TableGear is a software package for working with data on...
5. akeditable in place editor This is the plugin based on jEditable plugin created by...

Do you like this post?

Email: