A lightweight, extendable, JavaScript HTML table library written in TypeScript and transpilled to Vanilla JavaScript. Similar to jQuery DataTables for use in modern browsers, but without the jQuery dependency.
See the demos here and the documentation here.
For upgrading from one major version to another, check the upgrade guide: https://fiduswriter.github.io/simple-datatables/documentation/Upgrading
Note: The upgrade from version 5 version 6 is the most complicated upgrade so far. Please read through the instructions before filing complaints. If you run simple-datatables from a CDN, make sure that you have fixed it to a specific major or minor version so that you do not accidentally upload to a new version that requires you to do lots of manual adjustments.
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:
Note: For production websites, specify a specific major version. For example https://cdn.jsdelivr.net/npm/simple-datatables@6 for the latest version in the 6.x.x series or https://cdn.jsdelivr.net/npm/simple-datatables@6.0 for the latest version in the 6.0.x series.
<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>
LGPL
csv
, txt
, json
, and sql
csv
and json
datasimple-datatables Documentation
This project started as a fork of Vanilla-DataTables, but it has since been converted to TypeScript.
If you want a version that works in very old browsers (IE, etc.), then head over to https://github.com/fiduswriter/simple-datatables-classic .
npm install simple-datatables --save
yarn add simple-datatables
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 parameter:
import {DataTable} from "simple-datatables"
const dataTable = new DataTable("#myTable", {
searchable: false,
fixedHeight: true,
...
})
If using the CDN:
const dataTable = new simpleDatatables.DataTable("#myTable", {
searchable: false,
fixedHeight: true,
...
})
npm install
in the Terminalnpm run test_server
to test your code. This runs on port 3000 (http://localhost:3000/)npm run build
in the Terminal to build the final filesAuthor: fiduswriter
Source Code: https://github.com/fiduswriter/simple-datatables
License: View license