Author: | luverolla |
---|---|
Views Total: | 3,789 views |
Official Page: | Go to website |
Last Update: | June 18, 2021 |
License: | MIT |
Preview:

Description:
js-datatable is a simple-to-use JavaScript library that converts a normal static HTML table into a user-friendly table view with sorting, searching, and pagination features.
How to use it:
1. Insert the stylesheet datatable.css and JavaScript datatable.js into the document.
<!-- Core --> <link rel="stylesheet" href="css/datatable.css" /> <script src="js/datatable.js"></script> <!-- Local File --> <script src="js/locales.js"></script>
2. Add the data-component="datatable"
attribute to your HTML table and determine the language you want to use.
<table data-component="datatable" id="example" data-locale="en"> <thead> <tr> <th>User code</th> <th>Name</th> <th>Surname</th> <th>Country</th> <th>City</th> </tr> </thead> <tbody> ... </tbody> </table>
3. Enable live search functionality on the data table.
<table data-component="datatable" id="example" data-locale="en" data-search="true"> .... </table>
4. Add your translation strings to the locales.js
window.DT_LOCALES["en"] = { SEARCH: "search", PER_PAGE: "{NUM} per page", SHOWING_TO: "rows {FROM} to {TO} of {SIZE}", GOTO_FIRST: "go to page 1", GOTO_PREV: "go to previous page", GOTO_PAGE: "go to page {NUM}", GOTO_NEXT: "go to next page", GOTO_LAST: "go to last page", ASC_ACTIVE: "ascending order active", DESC_ACTIVE: "descending order active", NOT_ACTIVE: "not active" }
Changelog:
06/18/2021
- Fixed search and pagination bug
03/29/2021
- Minor improvements