Skip to content

ibnujakaria/protable

Repository files navigation

ProTable

A data-table alternative written with modern javascript.

Docs

Open Full Documentation.

Basic Usage

Installation

npm i protable

Create From Array

HTML 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:

NameRelationshipBlogCity
Nurul HudaMarriedhttps://jagongoding.com-
Abdullah Wahid--Bangkalan
Lendis Fabri-https://kopiding.inLamongan
Elmo BachtiarSingle--

Create Complex Table From Array

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:

NameBirthCity
DayMonthYear
Nurul Huda1January1996Surabaya
Wahid Abdullah2February1996Bangkalan
Lendis Fabri3Maret1996Lamongan

License

The Pro Table library is open-source software licensed under the MIT license.