/htmlson.js

Convert JSON array of objects into to HTML table!

Primary LanguageJavaScriptMIT LicenseMIT

N|Solid

Features

  • Convert JSON array of objects into to HTML table!
  • Convert HTML table into JSON object!
  • Header Class name: add class name with format
  • Row Class name: add class name with format

Available configurations:

  • data: array(array of objects)
  • headers: object(key-value pair index by the number of row and the custom name of the value)
  • debug: boolean(we know what debug means :) )

Version 2.0.0

  • Added headers `class` name to header cells with format `"header_[object_key]"`
  • Added row `class` name to row cells with format `"row[object_key]"`
Demo

Installation

Using NPM:


npm install htmlson.js

Include:

<script src="node_modules/htmlson.js/dist/htmlson.min.js"></script>
 

Usage

htmlson.js requires a min version 1.9.1 of jQuery to run.

Initialize:

var htmlson = $('.testTable').htmlson({
    data: data,
    headers: {
        1: 'custom header name'
    },
    debug: true
}); 

Convert html table to JSON object:

var obj = htmlson.toJson();

Add row:

htmlson.addRow({
   "name": "New Kitty",
   "species" : "cat",
   "foods": {
       "likes": ["old food"],
       "dislikes": ["new food"]
   }
});

Remove row by index:

htmlson.removeRow(1);
    TODO:
  • Write HTML table based on json object depth

Updater:

Authors: