# Table Builder (simple javascript library)!

## Simple javascript library to build table from Json data

npm install:
[![Generic badge](https://img.shields.io/badge/npm-tablebuilderjs-green)](https://www.npmjs.com/package/tablebuilderjs/)
````
    npm i tablebuilderjs
````
add script and css (soon to publish on npm)
````
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/immi5556/immanuel.npm@v0.0.7/Immanuel.a7.npm/Immanuel.a7.tablebuilder/tablebuilder/dist/tablebuilder.css" />
<script src="https://cdn.jsdelivr.net/gh/immi5556/immanuel.npm@v0.0.7/Immanuel.a7.npm/Immanuel.a7.tablebuilder/tablebuilder/dist/tablebuilder.js"></script>
````
### Documentation (Features)

1. event -> 
	- onrowclick

2. config ->
	- roweditable = inline editing enabled for entire row

3. columns ->
	custom column type : with property name 'CustomProperty' and Type = 'Button' we can load custome grid column
	onevent: base on the type the onevent will be fired & the appropriate column config & row data is sen to this event 



````
	var tb = new TableBuilder({
            data: [
                {
                    TableGroupUID: 'Group Name 1',
                    TableName: "Table Name 1",
                    FullSyncQuery: "Full Sync Query",
                    DeltaSyncQuery: "Delta Sync Query"
                },
                {
                    TableGroupUID: 'Group Name 2',
                    TableName: "Table Name 2",
                    FullSyncQuery: "Full Sync Query",
                    DeltaSyncQuery: "Delta Sync Query"
                },
                {
                    TableGroupUID: 'Group Name 3',
                    TableName: "Table Name 3",
                    FullSyncQuery: "Full Sync Query",
                    DeltaSyncQuery: "Delta Sync Query"
                },
                {
                    TableGroupUID: 'Group Name 4',
                    TableName: "Table Name 4",
                    FullSyncQuery: "Full Sync Query Full Sync Query Full Sync Query Full Sync Query Full Sync Query Full Sync Query Full Sync Query",
                    DeltaSyncQuery: "Delta Sync Query"
                }
            ],
            columns: [
            {
                Property: "TableGroupUID",
                Display: "Table Group"
            },
            {
                Property: "TableName",
                Display: "Table Name"
            },
            {
                Property: "FullSyncQuery",
                Display: "Full Sync",
                Overflow: "ellipsis"
            },
            {
                Property: "DeltaSyncQuery",
                Display: "Delta Sync",
                Overflow: "ellipsis"
            }
        ]
        });

````

TO DOs:
	-- Enable few even subscriptions
	--

Tested & Will work only on modern browsers 

