Skip to content

Latest commit

 

History

History
95 lines (65 loc) · 1.91 KB

README.md

File metadata and controls

95 lines (65 loc) · 1.91 KB
Raw

Table actions

Simple & customizable table with search, sort, pagination and checkbox functions in vanilla JS

Development

Docker container running lite-server and watching code changes

make watch

Results can be tested in demos:

Generate bundle

Local bundle pack with project name and actual project version in root folder

make bundle

Run tests

Execute all tests suites of root /tests folder

make test

More

To see all make commands

make help

Installation

yarn add table-actions

Or directly in the HTML file

<!-- Add to head HTML tag -->
<link rel="stylesheet" href="./css/table-actions.min.css" />
<!-- Add to the bottom of body HTML tag -->
<script src="./dist/table-actions.js"></script>

<!-- or directly from unpkg -->
<link
  rel="stylesheet"
  href="https://unpkg.com/table-actions@latest/dist/table-actions.min.css"
/>
<script src="https://unpkg.com/table-actions@latest/dist/table-actions.min.js"></script>

Run

// Utils library functions: toNormalForm and newElement can be imported here
import { TableActions } from "table-actions";

const table = new TableActions("elementOrQuerySelector", {
  /* options */
}); // only this line when included with script HTML tag

Features

  • Checkable columns with callback function to interact with selected elements
  • Paginate
  • Sortable columns
  • Sort by date
  • Theme light and dark
  • Mobile theme options full responsive
  • Search field
  • Populate table with json data (example: demo/json-data-table.html)

Roadmap

  • API request data to populate Table

References

Theme and mobile reference