News in versions: FastGrid 1.0, TreeGrid 17.0
FastGrid FastSheet ExamplesSamples DocumentationDoc Download Licensing Prices Buy Development
services
References References Contacts
TreeGrid Gantt chart SpreadSheet ExamplesSamples DocumentationDoc Download Licensing Prices Buy Contacts
FastGrid documentation
Search in documentation
FastGrid versions compatibility

Changes log (txt file) Compare FastGrid 1.0 & TreeGrid 17.1

Using in JavaScript frameworks

Angular Ember Express React Svelte Vue Other frameworks NodeJS server SalesForce LWC

Data and creating FastGrid

Simple examples of creating FastGrid Create FastGrid Display grid Access grid by API Sheets, more grids switched in one place Layout and configuration Data rows, columns, toolbars, images Changes in data rows, columns, toolbars Saving changes to server Mark changes Loading children on expand parent Short format

Layout - grid parts

Parts - ColParts and RowParts Part size Part scroll position Sets Column sets Row sets

Toolbars

Toolbar Cells Icon Height Width Toolbar position Dragging and manipulating cells Special toolbars

Rows and columns
Default rows, columns, cells, toolbars
Row and column identity

Row / column id Row / column index Row / column name

Row and column manipulation

API to get grid objects Auto added columns & rows on scroll Blocks of rows / columns Adding / copying / moving Deleting Showing and hiding Layout menu Selecting rows and columns Fill cell values by dragging Locking grid against changes Undo & redo

Row and column tree

Row and column tree Row tree Column tree Expand & collapse

Cells
Cell values and attributes

Read and write any values by API Cell value Cell attributes Cell value & attributes in UTF8 Store

Editing cells

Editing During editing Validation and errors

Cell images

Row cell side icons Icons definition Mark icons and charts Mark icons list Row cell floating images

Cell size

Row height Column width Resizing rows and columns Padding Margin Cell span

Cell style

Grid style and look Cell style permissions Cell style Cell outer border Cell inner border Alternate row & column background

Other cell features

Cell hyperlink Cell tooltip Static cells Other cell attributes Row & column attributes to speed up

Cell types and formats
Cell type and format Range - more values / ranges in cell String type Html type Auto type
Bool type

Bool type Check side icon Bool type & Check side icon

Number type

Format Localization

Date type

Format Localization Calendar

Calculations - formulas
JavaScript formulas

JavaScript formulas Aggregate functions String aggregate functions Other functions

Editable formulas

Formula rules Formula attributes Defined names for editable formulas Conditional functions Lookup functions Cell reference functions Logical functions Informational functions Mathematical functions Trigonometry functions Rounding numbers Number conversions String functions Date functions Summary functions

Dialogs and menus

Dialog Dialog Place Dialog API Menu definition in Script Cell menu List Suggest

Features
Sorting rows / columns

Sorting Sorting settings Comparing strings

Grouping rows / columns

Grouping Grouping settings Comparing strings Pivot grid

Filtering rows and columns

Filtering Filter settings Comparing strings

Search in cells Import files to grid
Export files

Export files Export and copy to clipboard CSV data

Copy & paste via system clipboard

Copy & paste Copy to clipboard Paste from clipboard

Printing

Print Print to PDF

Global grid settings
Grid size & scroll

Grid size Grid scrollbars Paging and view Media rules - responsive design

Saving settings in storage or cookies
Focus and hover cells

Focus cell and cell ranges Mouse hover cells Highlight cells, rows and columns

Events

Mouse events Key events API events

Language

Translation Languages

Messages

Message Message style

Other API

API for iterating rows and columns Paint and repaint Various API methods

Debug & files

Debugging FastGrid files

UTF8 Store - fast & short data
Introduction - License & download

Basic description Main advantages Basic usage License Download Documentation

Script language implementations

JavaScript C# JAVA PHP

Suggested ucodes

Bits - small integers or enums Integers or enums with strings Date and time Floating point numbers Special strings

Basic ucodes

Integer 1 char String 1 char Date 1 char Bits 1 char Integer 2 chars String 2 chars Date 2 chars Float 2 chars Integer 3 chars String 3 chars Date 3 chars Integer and double float 5 chars String 5 chars Date 5 chars Fixed length string Separated strings Adjacent strings Prefix for escaping string Fixed length data Unused custom codes Prefix for stored separator or length Prefix for stored base number Unused basic ucodes

Complex ucodes

chars signed decimals multiple limits varstrings escape base chars2 signed2 decimals2 multiple2 limits2

Internal coding Profiling times for ucode options Function reference

Debug & files

FastGrid documentation

Debugging

! Cfg int

DebugLevel

[4] GetCfgAttr SetCfgAttr
What FastGrid information will be logged to browser console.
0 - logs only fatal errors, use for production releases,
1 - logs only errors,
2 - logs errors and warnings, must be set or higher for DebugCheck,
3 - also logs informational messages,
4 - also logs times spent by individual actions, if exceeded DebugMinTime or DebugPaintMinTime,
5 - also measures the spent times by browser layout / reflow, can slow down paint!
! Cfg int

DebugCheck

[5] GetCfgAttr SetCfgAttr
If checks the input JSON data for errors, if there are not set unknown attributes or tags. Requires setting DebugLevel >=2.
0 - no checking, no warnings, use for production releases,
1 - checks only unknown tags,
2 - checks also unknown attributes in tags Cfg, Format, Font, Place, RowParts (also if defined separately), ColParts (also if defined separately), DefRows, DefCols, DefCells, DefToolbars, DefTools, DefImages, Cols (all columns defintions), Toolbars (all toolbars and their cells), Images. Can slightly slow down loading!,
3 - checks also value types in attributes,
4 - checks also unknown attributes in all rows and cells (in A), can slow down loading if defined too many A attributes in rows!
5 - checks also value types in attributes in all rows and cells, can slow down loading if defined too many A attributes in rows!
By default it is set to 5, but not for FastGrid default data. If modified FastGrid default data in sources, for testing purposes set DebugCheck=5 in Defaults.js
It can be placed only to Cfg tag without any suffix _xxx!
Cfg int

DebugMinTime

[50] GetCfgAttr SetCfgAttr
Minimal spent time to be logged by DebugLevel >= 4.
Cfg int

DebugPaintMinTime

[30] GetCfgAttr SetCfgAttr
Minimal spent time to be logged by DebugLevel >= 4 for actions during Paint.
Grid method void

Debug

(int debuglevel = 3, any text = null, any text2 = null, ... )
Logs given text and next parameters to browser console if debuglevel <= DebugLevel.
debuglevel also controls the color of the text, 0 - big red, 1 - red, 2 - orange, 3+ - light green. debuglevel can be omitted and text passed as the first parameter.
Every odd text is written in bold (text2, text4, ...).

FastGrid files

Complete FastGrid code is included in the only single file FGridE.js. Only this file can be used in final distributed applications!
The other files are available only within some FastGrid sources distribution: Partial sources / Backup sources / Debug sources, and can be used only for development.
To use changes done in the other files in distribution, the files must be compiled to the FGridE.js by provided compiler.
file

FGridE.js

Main FastGrid script. It is the only required file to use FastGrid.
It must be included to the HTML page by <script> tag before using any FastGrid items.

If used Content-Security-Policy, FastGrid requires at least these permissions:
default-src 'self'; script-src 'self' 'unsafe-eval'; style-src 'self' data: 'unsafe-inline'; font-src 'self' data:; img-src 'self' data:
file

FGridED.js

Loads FGridE.js on demand.
Include the FGridED.js instead of FGridE.js to load the FastGrid main script FGridE.js on demand only when some FastGrid is being created.
It must be in the same directory as the FGridE.js.
It must be included to the HTML page by <script> tag before using any FastGrid items.
file

FGridEPart.js

Include the FGridEPart.js instead of FGridE.js to load the FastGrid main script using sources in GridSrc directory.
It must be in the same directory as the FGridE.js.
Use only for development.
It must be included to the HTML page by <script> tag before using any FastGrid items.
It must not be included in any web page available outside the licensed company. It works only on IP addresses 127.0.0.1, 192.168.x.x, 10.x.x.x and localhost server name.
Available only with FastGrid sources.
file

FGridESrc.js

Include the FGridESrc.js instead of FGridE.js to load the FastGrid main script using sources in JS and GridSrc directories.
It must be in the same directory as the FGridE.js.
Use only for development.
It must be included to the HTML page by <script> tag before using any FastGrid items.
It must not be included in any web page available outside the licensed company. It works only on IP addresses 127.0.0.1, 192.168.x.x, 10.x.x.x and localhost server name.
Available only with FastGrid Debug sources.
file

Defaults.js

FastGrid source file with default settings.
Available only with FastGrid sources. It is compiled to FGridE.js.
file

Texts.js

FastGrid source file with all texts and language dependent settings.
Available only with FastGrid sources. It is compiled to FGridE.js.
file

Text_{Code}.js

FastGrid source file with specific language and all its texts and language dependent settings. The {Code} is the language code like "DE" or "ES".
Available only with FastGrid sources. It is compiled to FGridE.js.
file

Styles.js

FastGrid source file with all style settings like colors, borders, etc.
Available only with FastGrid sources. It is compiled to FGridE.js.
file

Style_{Style id}.js

FastGrid source file with specific style and all its settings. The {Style id} is the style name like "Black" or "White".
Available only with FastGrid sources. It is compiled to FGridE.js.
file

Dialogs.js

FastGrid source file with all predefined menus.
Available only with FastGrid sources. It is compiled to FGridE.js.
file

Toolbars.js

FastGrid source file with all default toolbars and default toolbar cells.
Available only with FastGrid sources. It is compiled to FGridE.js.
file

Sheet.js

FastGrid source file with settings specific to display FastGrid as SpreadSheet.
It is loaded only if some input data is in xlsx format or it defines Book and SheetJs attributes.
Available only with FastGrid sources. It is compiled to FGridE.js.
file

Menu.js

FastGrid source file with implementation of menu dialog using FastGrid.
Available only with FastGrid sources. It is compiled to FGridE.js.
file

Calendar.js

FastGrid source file with implementation of calendar (datepicker) dialog using FastGrid.
Available only with FastGrid sources. It is compiled to FGridE.js.
file

LucidaSansUnicode12s.woff2.js

FastGrid source file with special font used as FastGrid base font "LucidaSansUnicode".
This font is very fast to render and contains also special characters for FastGrid to speed up rendering.
Available only with FastGrid sources. It is compiled to FGridE.js.
file

UZIP.js

Third party script for ZIP compression, homepage at https://github.com/photopea/UZIP.js, distributed under MIT license.
Used to load and save xlsx files.
It is the only third party code included in FastGrid!
Available only with FastGrid sources. It is compiled to FGridE.js.