A data-table alternative written with modern javascript.
Open Full Documentation.
npm i protableHTML container:
<div id="table-from-array"></div>Js:
import { fromArray } from 'protable'
fromArray('#table-from-array', [
{
name: 'Nurul Huda',
relationship: 'Married',
blog: 'https://jagongoding.com'
},
{
name: 'Abdullah Wahid',
city: 'Bangkalan'
},
{
city: 'Lamongan',
name: 'Lendis Fabri',
blog: 'https://kopiding.in'
},
{
name: 'Elmo Bachtiar',
relationship: 'Single'
}
])Table Output:
| Name | Relationship | Blog | City |
|---|---|---|---|
| Nurul Huda | Married | https://jagongoding.com | - |
| Abdullah Wahid | - | - | Bangkalan |
| Lendis Fabri | - | https://kopiding.in | Lamongan |
| Elmo Bachtiar | Single | - | - |
import { fromArray } from 'protable'
fromArray('#table-from-array-2', [
{
name: 'Nurul Huda',
birth: {
day: 1,
month: 'January',
year: 1996
},
city: 'Surabaya'
},
{
name: 'Wahid Abdullah',
birth: {
day: 2,
month: 'February',
year: 1996
},
city: 'Bangkalan'
},
{
name: 'Lendis Fabri',
birth: {
day: 3,
month: 'Maret',
year: 1996
},
city: 'Lamongan'
}
])Table Output:
| Name | Birth | City | ||
|---|---|---|---|---|
| Day | Month | Year | ||
| Nurul Huda | 1 | January | 1996 | Surabaya |
| Wahid Abdullah | 2 | February | 1996 | Bangkalan |
| Lendis Fabri | 3 | Maret | 1996 | Lamongan |
The Pro Table library is open-source software licensed under the MIT license.