Dynamic Table Creation In Pure JavaScript – GridTableJS

Preview:

Description:

GridTableJS is a JavaScript library to dynamically generate complex HTML tables using pure JavaScript.

How to use it:

Insert the JavaScript file ‘gridtable.js’ into the document and we’re ready to go.

<script src="src/gridtable.js"></script>

Create a placeholder element in which you want to render the dynamic table.

<div id="myTable"></div>

Initialize the GridTableJS.

table = gridtablejs.createTable(parentElemId = "myTable");

Add your tabular data to the table. Available parameters:

• row: The row.
• column: The column.
• content: The contents of the cell.
• customAttributes: Any HTML attributes to be set.
• domTag: The HTML DOM tag for the cell.

table.addCell(row, column, content, customAttributes, domTag);

Add grouped data to the table.

table.addCells(row, column, content, customAttributes, domTag);

Renders the table to the parent element provided at initialisation.

table.render()