Best jQuery Tables Plugins & Tutorials with Demo

Simple Data Table with JavaScript

Simple Data Table with JavaScript

Lightweight and simple data table with no dependencies.

Features:

  • Display data (array with objects) in simple table
  • Lazy loading of data (you can load data whenever you can)
  • Support custom skins
  • Small size of package
  • No dependencies
  • Support custom events (update, add, remove)
  • Fluent API
  • Recognize data in input and change input type

Toast UI Grid : The Powerful Component to Display and Edit Data

Toast UI Grid : The Powerful Component to Display and Edit Data

Toast UI Grid is the Powerful Component to Display and Edit Data.Experience the Ultimate Data Transformer!

Features:

  • Custom cell formatter & converter
  • Various input types (checkbox, radio, select, password, etc)
  • Full keyboard navigation (move, select, copy, paste, delete, etc)
  • Virtual scrolling (Handling large dataset without performance loses)
  • Copy & Paste using clipboard with 3rd party application (Like MS-Excel or Google-spreadsheet)
  • Column resize & reorder & show & hide
  • Multi column headers
  • Validation
  • Pagination
  • Merging cell

ScrollHint : JavaScript Scrollable Horizontally Elements

ScrollHint : JavaScript Scrollable Horizontally Elements

A javascript library to suggest that the elements are scrollable horizontally, with the pointer icon.

Mobile Friendly Responsive Table with jQuery

Mobile Friendly Responsive Table with jQuery

A mobile-friendly table solution, which persists headers for each table-cell on mobile devices.On mobile devices the orientation changes from horizontal to vertical, and each cell is prepended with its respective table header as a label.

Dgtable : jQuery High-performance Table for Web Apps

Dgtable : jQuery High-performance Table for Web Apps

Dgtable is a table View for jQuery, which is meant to be high-performance, and allow simple user interactions with the UI, such as:

  • Sorting
  • Sorting by more than one column
  • Moving columns
  • Resizing columns
  • Full cell preview when hovering
  • Native RTL support

Scrollbooster : Enjoyable Content Drag-to-scroll library

Scrollbooster : Enjoyable Content Drag-to-scroll library

Scrollbooster is a enjoyable content drag-to-scroll micro (~2KB gzipped) library.

Yet Another DataTables Column Filter : jQuery Plugin

Yet Another DataTables Column Filter : jQuery Plugin

This jQuery plug-in allows the user to easily add filter components to table columns, the plug-in works on top of the DataTables jQuery plug-in.

Features:

  • Support DataTables 1.10.0 – Use yadcf.init(…) for new API (Capital “D”)
  • Support all data source: DOM, Javascript, Ajax and server-side processing (1.10.0 +)
  • Various filter options:
  • select input, multiple selection input, text input
  • autocomplete input – make use of the jQuery UI Autocomplete widget (with some enhancements)
  • date input – make use of the jQuery UI Datepicker widget (with some enhancements)
  • range of numbers
  • range of numbers with slider widget – make use of the jQuery UI Slider widget (with some enhancements)
  • range of dates – make use of the jQuery UI Datepicker widget (with some enhancements) or Bootstrap Datepicker
  • custom function
  • Filters can be placed in the header (thead) or in the footer (tfoot) , second argument of yadcf constructor or third argument of init function

Tabullet : jQuery Editable Table Row Plugin

Tabullet : jQuery Editable Table Row Plugin

Tabullet is a simple jQuery plugins for creating a table that can insert, edit, and delete row in one place.

Xcell : Spreadsheet-like Calculations in JavaScript

Xcell : Spreadsheet-like Calculations in JavaScript

Xcell is a tiny, open source (MIT) library for building reactive, spreadsheet-like calculations in JavaScript.

Csv-Calc : jQuery plugin to calculate Prices from CSV

Csv-Calc : jQuery plugin to calculate Prices from CSV

Csv-calc is a jQuery plugin to load a CSV of products and calculate a sum of prices.