Installation

In this document you will learn several approaches of including FancyGrid.
FancyGrid is plugin-free library, it has no dependencies from other libraries.
FancyGrid has integration with Angular, React, Vue, jQuery and chart libraries (HighCharts and JS SparkLines).

Include FancyGrid

Include files from CDN

<script src="https://cdn.jsdelivr.net/npm/fancygrid/client/fancy.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/fancygrid/client/fancy.min.css" rel="stylesheet">

Alternatively load files from own domain

<link href="/fancygrid/fancy.min.css" rel="stylesheet">
<script src="/fancygrid/fancy.min.js"></script>

FancyGrid has intelligent modules system that
auto detects and loads all needed modules by self.

If you include files from own domain than set modules dir url.

Fancy.MODULESDIR = '/fancygrid/modules/';

Fancy.MODULESDIR = 'https://cdn.jsdelivr.net/npm/fancygrid/client/modules/';

Full built

Another way of including is full built.
In this case modules system will not load any module.

<link href="/fancygrid/fancy.min.css" rel="stylesheet">
<script src="/fancygrid/fancy.full.min.js"></script>

npm

Run the following command to start your download.

npm install fancygrid

Integration

JQuery

FancyGrid is integrated with jQuery.
If jQuery is included to page than FancyGrid will switch to use it's API.

In this case include JQuery on the page.
For example.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

Angular, React, Vue, TypeScript, ES6

In this section "Getting Started" there are articles for each solution.

For Chart samples

To use chart integration include HighCharts.

<script src="http://code.highcharts.com/highcharts.js"></script>

Get Started