EzEditTable - Enhance HTML Tables

ezEditTable – Enhance HTML Tables

ezEditTable 2.3.1 is a javascript code aimed toward enhancing common HTML tables by including options akin to inline modifying parts, superior choice and keyboard navigation. With only a line of code you possibly can simply convert a daily HTML desk in a complicated editable and selectable grid management.

Main options

Attach to an current HTML desk
Advanced choice mannequin
Extended keyboard navigation
Inline cell or row modifying
Insert and take away rows
Send adjustments to server by way of GET or POST type submission, AJAX requests or by script injection (solely GETs)
Integration with any server-facet expertise as this can be a pure shopper-facet resolution
Can be used as an extension of the brand new TableFilter beforehand HTML Table Filter Generator script to offer much more superior capabilities to common HTML tables
Callbacks for all occasions, and delegates for many actions
Based on plain javascript, that’s, impartial from any javascript
framework however suitable with any of them (no for..in and so on.)
Exhaustive documentation and API

What’s new?

This model comes with the next options:

AJAX help for information submission. Data adjustments can now be despatched by way of type submission, AJAX requests and script injection
help for insert and delete keys in version mode
possibility for triggering cell editor on keystroke (editable_on_keystroke)
possibility for positioning new row at desired row index within the desk (new_row_pos)

and a demo that includes AJAX help (jQuery):

Changes persisted via AJAX calls (jQuery)

Demos

This assortment of samples reveals how simple it’s to configure this script:

Samples

Styling

The script comes with 3 themes and an in depth API for CSS definitions:

Theme roller
Custom layout outlined with the API’s CSS properties

Server-side integration

Examples displaying server-facet (Php/MySql) integration out there at script’s
demos page:

Advanced grid part

Combined with the brand new TableFilter beforehand HTML Table Filter Generator this script supplies superior grid part options:

Important word

The intention of this code is to boost the HTML tables capabilities, and supply a generic or customized solution to ship information to server for DB operations it doesn’t matter what server expertise you employ. The examples featured on the script’s web site use PHP and MySql and are supposed to present the best way to configure the script with the intention to ship information to the server. This is just not a PHP / MySql based mostly resolution, you would use this script with different server facet applied sciences.

Why use this script?

If it is advisable to enhance customers’ expertise when coping with information tables in your web site, this code might be a quick and environment friendly resolution. This script focuses in 3 primary areas:

Keyboard navigation:
a complicated keyboard navigation much like what you’ll count on in non-net based mostly purposes
Selection mannequin (row and/or cell):
an prolonged choice mannequin, combining rows and cell if wanted, and permitting a number of rows choice by holding Ctrl or Shift keys
Edition parts (cell or row editor):
a easy solution to convert a plain HTML information desk in an editable grid management and maintaining shopper-facet logic utterly separated from server-facet logic

Moreover, the exhaustive script’s API may even allow you to simply create your superior parts based mostly on this grid. A whole set of callbacks for each occasion and delegates for each motion makes this grid absolutely customizable and extensible in your challenge necessities.

Changelog

2016-05-13

v2.3.1 is a bug repair launch:

Fixed onkeypress occasion bug with textual content-space and choose cell editors

2015-03-15

v2.3 is a bug repair launch:

Fixed choice bug taking place after bulk rows deleting
Added starter web page to documentation

2014-05-25

v2.2 comes with these options and enhancements:

AJAX help for information submission. Data adjustments can now be despatched by way of type submission, AJAX requests and script injection
help for insert and delete keys in version mode
possibility for triggering cell editor on keystroke (editable_on_keystroke)
possibility for positioning new row at desired row index within the desk (new_row_pos)