NEW

DataGrid Library

JavaScript library for sorting, filtering,
and pagination of any HTML content

Examples Documentation
DataGrid Library DataGrid Library
DataGrid is a simple and powerful solution to enable
sorting, filtering, and pagination on any page.

Demo Pages

Shoe Product List

Bootstrap

Real Estate Demo

Bootstrap

Restaurants Demo

Bootstrap

Vehicles Demo

Foundation

Dogs Breeds

Materialize CSS

Courses Demo

Semantic UI

Multiple DataGrids

Bootstrap

Users Table

Bootstrap

Deep Links & Storage

Deep Links Demo

Local Storage Demo

Cookies Demo

Main Features

  • DataGrid library works with any HTML structure using data attributes.
  • The library allows the sorting of text and numeric information.
  • It has configurable pagination control with a rich set of settings.
  • The library supports text filters with multiple modes and options.
  • The library has different path filters, like checkboxes, radio buttons, and select controls.
  • The widget is written in pure ES6 JavaScript, no dependencies are required.
  • The library has the support of deep links that generate a unique URL for every controls state combination.
  • DataGrid works well with HTML tables, including header sorting, text filtering, and more.
  • The library supports multiple instances with different settings and attributes on the same page.
  • The library support local storage, session storage and cookies.

Controls

More Features

  • The same control may appear multiple times on the page.
  • Controls may be placed anywhere in the document, event in the content items.
  • Any HTML content is supported, for example, DIV elements, tables, UL / OK lists, etc.
  • DataGrid library can be used with any CSS framework or with custom styles.
  • In most cases, the user defines HTML & CSS of controls (the library does not create their structure except pagination control).
  • The user ultimately defines all look & feel of the page; DataGrid library has minimal CSS styles.