What is fTable

FTable is a clean, vanilla JavaScript rewrite of the popular jTable plugin, designed for modern web apps.

✅ No dependencies
✅ Dynamic forms & async fields
✅ Localization
✅ Responsive
✅ MIT Licensed

Screenshots

FTable is a clean, vanilla JavaScript rewrite of the popular jTable plugin, designed for modern web apps.

Features

✅ Create, Read, Update, Delete
✅ Sorting, Paging, Filtering
✅ Dynamic dependent fields
✅ Ajax loading for data and options
✅ Localization via fTable.setMessages(...)
✅ Modal forms
✅ Column visibility, resize and reorder
✅ CSV export, Print
✅ User preferences (localStorage)

Install

Use one of the releases on github or download the files directly Or use npm:

npm install @liedekef/ftable

Usage

As a standalone script:

<linkhref="ftable/themes/lightcolor/gray/ftable.css"rel="stylesheet"><scriptsrc="js/ftable/ftable.js"></script>
const table = new FTable('#table', {actions: {listAction: '/api/users',createAction: '/api/users/add',updateAction: '/api/users/update',deleteAction: '/api/users/delete'},fields: {id: {key: true,list: false},name: {title: 'Name'},email: {title: 'Email',type: 'email'}}});

As a module:

import'@liedekef/ftable/ftable.css';importFTablefrom'@liedekef/ftable';consttable=newFTable('#table',{actions: {listAction: '/api/users',createAction: '/api/users/add',updateAction: '/api/users/update',deleteAction: '/api/users/delete'},fields: {id: {key: true,list: false},name: {title: 'Name'},email: {title: 'Email',type: 'email'}}});

Notes

See the wiki for documentation, demos, themes and more...