Skip to content

Latest commit

 

History

History
79 lines (51 loc) · 2.09 KB

README.md

File metadata and controls

79 lines (51 loc) · 2.09 KB

Simple-DataTables

A lightweight, extendable, dependency-free javascript HTML table plugin. Similar to jQuery DataTables, but without the jQuery dependency.

Based on Vanilla-DataTables, but written in ES2018.

CDN

To use the CDN version of Simple-DataTables use either https://cdn.jsdelivr.net/npm/simple-datatables@latest or https://unpkg.com/simple-datatables. You also need to add the CSS styling, so the elements you'll add to html head element can for example be these:

<link href="https://cdn.jsdelivr.net/npm/simple-datatables@latest/dist/style.css" rel="stylesheet" type="text/css">
<script src="https://cdn.jsdelivr.net/npm/simple-datatables@latest" type="text/javascript"></script>

License

LGPL

Features

  • Sortable columns
  • Pagination
  • Searchable
  • Customisable layout
  • Customisable labels
  • Customise column rendering
  • Load data via AJAX requests
  • Export to common formats like csv, txt json, and sql
  • Import csv and json data
  • Control column visibility
  • Reorder or swap columns
  • dayjs integration for sorting columns with datetime strings
  • Extentable with custom plugins See the Simple-DataTables wiki

Simple-DataTables Documentation


Install

npm

npm install simple-datatables --save

Quick Start

Then just initialise the plugin by import DataTable and either passing a reference to the table or a CSS3 selector string as the first parameter:

import {DataTable} from "simple-datatables"

const myTable = document.querySelector("#myTable");
const dataTable = new DataTable(myTable);

// or

const dataTable = new DataTable("#myTable");

You can also pass the options object as the second paramater:

import {DataTable} from "simple-datatables"

const dataTable = new DataTable("#myTable", {
	searchable: false,
	fixedHeight: true,
	...
})