The fastest open-source web component of data table

by Vue.js Examples

Cheetah Grid

The fastest open-source web component of data table.

View demo Download Source

Downloading Cheetah Grid

Using Cheetah Grid with a CDN

<script src="https://unpkg.com/cheetah-grid@0.5.x"></script>

Downloading Cheetah Grid using npm

$ npm install cheetah-grid

const cheetahGrid = require("cheetah-grid")

Downloading Cheetah Grid source code

cheetahGrid.es5.min.js

SourceMap
cheetahGrid.es5.min.js.map

Downloading Cheetah Grid using GitHub

git clone

$ git clone https://github.com/future-architect/cheetah-grid.git

npm install & build

$ npm install
$ npm run build

built file is created in the ./packages/cheetah-grid/dist directory

Usage

        grid = new cheetahGrid.ListGrid({
            // Parent element on which to place the grid
            parentElement: document.querySelector('#parent'),
            // Header definition
            header: [
                {field: 'check', caption: '', width: 50, columnType: 'check', action: 'check'},
                {field: 'personid', caption: 'ID', width: 100},
                {field: 'fname', caption: 'First Name', width: 200},
                {field: 'lname', caption: 'Last Name', width: 200},
                {field: 'email', caption: 'Email', width: 250},
            ],
            // Array data to be displayed on the grid
            records,
            // Column fixed position
            frozenColCount: 2,
        });

GitHub