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

Saving settings in storage or cookies

FastGrid documentation

Actual grid settings can be saved to browser storage and reloaded next time or sent to server and downloaded next time.

The configuration is saved automatically after any change by AutoCookie. To save configuration only manually set AutoCookie = 1 and call SaveCookie(1).
Cfg bits

AutoCookie

[17] GetCfgAttr SetCfgAttr
If the configuration is automatically saved and loaded.
1. bit &1 - loaded on start.
2. bit &2 - saved on every configuration change. If set, hides Save icon on Cookie toolbar.
3. bit &4 - loaded after changed actual configuration in Cookies menu on toolbar Cookies. If set, hides Load icon on Cookie toolbar.
4. bit &8 - loaded and saved actually chosen configuration name in CookieId.
5. bit &16 - loaded and saved actual value of AutoCookie itself.
Regardless on this value, the configuration can be still loaded and saved by API LoadCookie / SaveCookie.
? Cfg bool

ResetCookie

[1] GetCfgAttr
If set, stores default grid configuration on start and permits resetting grid back to default configuration.
It can slightly slow loading large grids with many columns or rows saved to cookies.
Shows Reset button in Settings menu and Default settings option in Cookies list on Cookies toolbar.
Cfg bool

CheckChangesCookie

[0] GetCfgAttr SetCfgAttr
If set, repaints toolbars on every configuration change to disable / enable SaveCookie / LoadCookie buttons on toolbar Cookies.
Cfg int

Storage

[1] GetCfgAttr SetCfgAttr
If and where the grid configuration is saved.
0 - grid configuration is not saved or loaded. Disables also API LoadCookie / SaveCookie.
1 - uses localStorage. It is persistent.
2 - uses sessionStorage. It is cleared after closing browser.
3 - uses document.cookie. It is persistent for one year. It is limited to 4000 characters, so it can be used only for small configurations.
4 - uses grid Cookies. It is not persistent and should be saved to server.
Cfg string

CookieId

["$NormalCookie"] GetCfgAttr SetCookieId
Unique configuration name. There can be more saved configurations differing the by the CookieId for the same grid (CookieGroup and Version).
Under this name the grid configuration is saved to and loaded from Storage.
It can contain any characters. It can be changed by API or in Cookies toolbar to load or save different configuration.
Cfg string

CookieGroup

[ ] / ["Book"] GetCfgAttr SetCfgAttr
Configuration group name. If not set, grid id is used.
Under this name the grid configurations are filtered, only configurations saved with the same CookieGroup and Version are available for the grid from Storage.
It can contain any characters.
Ignored for Storage = 4.
For Sheet it is set to "Book" by default, so all Book grids on the same url share their configuration by default.
Cfg string

Version

GetCfgAttr SetCfgAttr
If set, it loads configuration only if it was saved with the same Version string. Version string can be any string.
Also the list of configurations got by GetCookies contains only cookies with given version.
Cfg string[]

SettingsMenu

[...] GetCfgAttr SetCfgAttr
Comma separated string or array of items shown in configuration menu. The menu is shown on click on toolbar Settings button. It can contain "-" item as separator. It can contain these keywords:
ShowDeletedRows - if deleted rows are shown in red or hidden, sets DeletingRows attribute,
ShowDeletedCols - if deleted columns are shown in red or hidden, sets DeletingCols attribute.
ShowPrintPageBreaks - if shows how the grid will be split to pages - if shows print page borders in the grid, sets ShowPrintPageBreaks attribute,
HideZero - if cells with zero values are shown as empty, sets HideZero attribute,
ReversedRowTree - if row tree will be reversed - if shows parent rows below their children, sets ReversedTree attribute,
ReversedColTree - if column tree will be reversed - if shows parent columns right to their children, sets ReversedTree attribute,
Hover - what will be hovered under mouse cursor, sets Hover, HoverRow, HoverCol, HoverTool and HoverImage attributes,
Focus - if whole rows and columns will be highlighted in focus cursor, sets FocusRow and FocusCol attributes,
SortIcons - what sort icons will be shown and if click to whole header will do sort, sets SortIcons attribute,
Undo - which actions can be undone, sets Undo attribute,
Style - actual grid style, chooses from list defined by Styles, sets Style attribute,
Scrollbars - style and width of scrollbars, chooses from list defined by $ScrollbarsItems (in Texts.js) and CustomScrollWidths (in Styles.js), sets CustomScroll and CustomScrollWidth,
FixedScroll - if fixes scroll on the whole rows or their blocks, chooses from list defined by $FixedScrollItems (in Texts.js), sets FixedScroll attribute,
RowHeight - default row height in pixels, chooses from RowHeights (in Styles.js), sets RowHeight attribute,
IconZoom - scale of toolbar icons and toolbar height, chooses from IconZooms (in Styles.js), sets IconZoom and ToolbarHeight attributes,
Zoom - scale of the whole grid, chooses from Zooms (in Styles.js), sets Zoom,
RowBorder - if default row border is shown, sets RowBorder attribute,
ColBorder - if default column border is shown, sets ColBorder attribute,
RowAlternate - highlights every specified row, chooses from RowAlternates (in Styles.js), sets Alternate and AlternateCount attributes of default row part (DefRowPart),
SaveCookie - if saves cookie automatically after every configuration change, sets AutoCookie&2.
Cfg string / Source

CookieUrl

GetCfgAttr SetCfgAttr
An url to save all cofigurations in Cookies to server. Used only if set Storage = 4.
It can be set to string as direct url or to object as Source, with attributes Url, Data, Add, Param, Header, Sync, User, Pass, Safe, Debug. If not set Method, it is used as AJAX "post".
The saving is asynchronous.
The server response should contain at least "{}" as successful response.
Cfg string

CookieParamName

["Data"] GetCfgAttr SetCfgAttr
Name of the POST parameter where to upload the cookies by CookieUrl and Storage = 4.
Cfg string

CookieFlags

["Cookies"] GetCfgAttr SetCfgAttr
Comma separated string of flags for GetData to save all the configurations to server by CookieUrl and Storage = 4.
Cfg string

UrlBase

GetCfgAttr SetCfgAttr
String added before all custom relative urls. It should end by slash '/'.
It is also generated from actual url when Save data by "Print" option.
Grid object[id]

Cookies

List of predefined configurations or configurations loaded from server.
For Storage = 4 the configurations are also saved here.
Every object in cookies can contain these attributes:
string Version - configuration version, only cookies with the same Version can be loaded.
string Date - configuration date, informational attribute, when the configuration was saved.
bool Sealed - if set, the cookie cannot be changed, only its data loaded like default cookie. In Cookies list it is shown on top below default cookie.
object Cookie - the configuration data itself, standard FastGrid input data to be added. It should contain only data defined in grid Cookie to permit loading different configurations.
Grid object

Cookie

Defines which settings are saved to local storage or filled by GetData called with flags containing Cookie.
When defined the Cookie object more times, all the attributes are merged. To clear the previously defined values, set the first item as "-". To remove only the item, start it by "-".
Cookie string[]

Flags

["Cookie"]
Comma separated string of flags for GetData to save the configuration. If it does not contain Cookie flag, all other Cookie attributes are not used.
Cookie string[]

Cfg

Comma separated string or array of configuration (Cfg tag) attributes that are saved to local storage.
It can contain any Cfg attributes that can be got by GetCfgAttr. Especially these attributes:
Focused - actually focused cell(s).
Only attribute that has not null value is saved.
Cookie bool

Filters

[1]
If saves all filter rows and columns to local storage.
It saves all non null values in V and non zero filter operators in Filter. It saves also row / column FilterAction attribute.
Cookie bool

Scroll

[1]
If saves visibility of all scrollbars in grid to local storage.
Cookie string[]

RowParts

["Sort,Group,Filter"]
Comma separated string or array of row part attributes that are saved to local storage.
It can contain any row part attributes that can be got by GetPartAttr. Especially these attributes:
Sort - sort settings, Group - group settings, Filter - custom filters, Height - section height, ScrollTop - vertical scroll.
Only attribute that has not null value is saved.
Cookie string[]

ColParts

Comma separated string or array of column part attributes that are saved to local storage.
It can contain any column part attributes that can be got by GetPartAttr. Especially these attributes:
Sort - sort settings, Group - group settings, Filter - custom filters, Width - section width, ScrollLeft - horizontal scroll.
Only attribute that has not null value is saved.
Cookie string[][id]

Parts

Attributes saved for individual parts, to overwrite settings in RowParts / ColParts.
For example: Cookie:{ Parts:{ Body:"Sort,Group,Filter,Scroll",Cols:"Scroll" } }.
Cookie string[]

Rows

Comma separated string or array of row attributes that are saved to local storage.
It can contain any row attributes that can be got by GetAttr. Especially these attributes:
Height - actual row height if resized, Hidden - if the row is hidden, Collapsed - if the row children are collapsed, RS - row spans, CS - column spans.
Next - special flag, saves all row positions in their parts, First - special tag, saves only rows from the first page in every part.
Only attribute that has not null value different from default value is saved.
Cookie string[]

Cols

["Width,Hidden,Next"]
Comma separated string or array of column attributes that are saved to local storage.
It can contain any column attributes that can be got by GetAttr. Especially these attributes:
Width - actual column width if resized, Hidden - if the row is hidden, Collapsed - if the row children are collapsed.
Next - special flag, saves all column positions in their parts, First - special tag, saves only columns from the first page in every part.
Only attribute that has not null value different from default value is saved.
Cookie string[]

Toolbars

["Height,Hidden,Next"]
Comma separated string or array of toolbar attributes that are saved to local storage.
It can contain any toolbar attributes that can be got by GetAttr. Especially these attributes:
Hidden - if the toolbar is hidden.
Next - special flag, saves all toolbar positions in their parts.
Only attribute that has not null value different from default value is saved.
Cookie string[]

Tools

["Width,Hidden,Next"]
Comma separated string or array of toolbar cell attributes that are saved to local storage.
It can contain any toolbar cell attributes that can be got by GetAttr. Especially these attributes:
Hidden - if the toolbar cell is hidden, Value - cell value.
Next - special flag, saves all toolbar cell positions in their toolbar. Ignored if any tool has set More attribute.
All - special flag, adds attribute All = 1 to all toolbar cells to save cells moved between toolbars.The toolbar cells should have set their ids unique among all toolbars.
Only attribute that has not null value different from default value is saved.
Cookie string[][id]

Cells

Cell and toolbar cell values saved to local storage.
It is array by row / toolbar id, with column / tool ids as attributes.
For example: Cookie:{ Cells:{ Row1:"Col1,Col4,Col7", Toolbar3:"Tool1,MyButton,Button4" } }
Actions

SaveCookie

(int target = 0) OnClickSaveCookie
Saves configuration to Storage, immediately and regardless on AutoCookie.
Actions

LoadCookie

(int target = 0) OnClickSaveCookie
Loads configuration from Storage and applies it in grid data.
Actions

AddCookie

(int target = 0) OnClickAddCookie
Asks to enter new configuration name and adds it to the configurations, if it does not exist yet.
Actions

DeleteCookie

(int target = 0) OnClickDeleteCookie
Asks if to delete actual configuration. If permitted, deletes it and sets CookieId to "$NormalCookie".
Actions

ResetCookie

(int target = 0, string id = "", bool sheets = 0, bool closedialog = 0) OnChange of "Cookies" cell
Asks if to load default or Sealed configuration. To load default configuration, there must be set ResetCookie.
If set id, loads this Sealed configuration, for "" loads default configuration.
If set sheets, resets configuration in all sheets in the Book.
If set closedialog, closes the grid dialog on if choosen ok in confirmation message.
Grid method bool

SaveCookie

(int action = 0, string id = null, string version = null)
Saves configuration to Storage.
action = 0 - saves the configuration later on the paint. Only if set 2.bit (&2) of AutoCookie.
action = 1 - saves the configuration immediately and regardless on AutoCookie.
action = 2 - deletes the configuration.
action = 3 - tests if actual configuration is the same as saved configuration and returns true or false.
action = 4 - saves CookieId and AutoCookie only.
If set id, uses it as configuration id instead of CookieId.
If set version, saves it with the configuration as its version instead of Version.
Returns true for success.
Grid method any

LoadCookie

(int action = 0, string id = null, string version = null)
Loads configuration from Storage.
action = 0 - loads the configuration and applies it in grid data. Returns true for success.
action = 1 - returns the configuration string.
action = 2 - returns the configuration id, date and version in array as [id,date,version]. date returns as milliseconds since 1/1/1970. Returns always, even if if the version does not equal Version.
action = 3 - returns the configuration id, date, version and string in array as [id,date,version,cfg]. date returns as milliseconds since 1/1/1970.
If set id, uses it as configuration id instead of CookieId.
If set id = "", loads or returns default configuration saved on grid loading.
If set version, uses it as configuration version instead of Version. Pass "" to ignore the Version.
Grid method bool

AddCookie

(string id, bool noalert = 0)
Adds given id cookie, if it does not exists. Returns true for success.
If set noalert, does not alert if the cookie already exists.
Grid method bool

DeleteCookie

(string id = null, bool noalert = 0)
Deletes given id cookie or actual CookieId. Returns true for success.
If set noalert, does not alert if the cookie is default or normal cookie that cannot be deleted.
If deletes actual CookieId, sets it to "$NormalCookie".
Grid method void

SetCookieId

(string id)
Sets CookieId to the id and loads this configuration.
Grid method string[][]

GetCookies

(int type = 0, bits options = 0, string version = null, bool adddefault = 0, int separator = 0)
Returns all saved configurations in Storage for given grid according to the type:
type = 0 returns [id1,id2,id3,...].
type = 1 returns [[id1,date1,version1],[id2,date2,version2],....]
type = 2 returns [[id1,date1,version1,cfg1],[id2,date2,version2,cfg2],....]
If set options&1 = 1 and actual CookieId does not exists in saved cookies, it first saves it to list it in the returned cookies.
If set options&2 = 2 deletes all configurations with different Version.
If set version, uses it as configuration version instead of Version. Pass "" to ignore the Version.
If set adddefault, adds default cookie if ResetCookie is set.
If set separator, adds "-" item between Sealed and normal cookies. If se to 2, adds the "-" also after default cookie, if no Sealed cookies are present.
API event any

OnLoadCookie

(Grid grid, string data, string id, int date, string version)
Called before configuration data is loaded to the grid.
Return string with new data to load. Or return true to suppress the loading.
id is the saved configuration id set by CookieId. date is the saved configuration date in milliseconds since 1/1/1970.
API event void

OnLoadedCookie

(Grid grid, string data, string id, int date, string version)
Called after configuration data is loaded to the grid.
id is the saved configuration id set by CookieId. date is the saved configuration date in milliseconds since 1/1/1970.
API event any

OnSaveCookie

(Grid grid, string data, string id, int date, string version, int action)
Called before configuration data is saved to storage.
Return string with new data to save. Or return true to suppress the saving.
id is the saved configuration id set by CookieId. date is the saved configuration date in milliseconds since 1/1/1970.
action = 1 - save, 2 - delete, 3 - compare (will not call OnSavedCookie).
API event void

OnSavedCookie

(Grid grid, string data, string id, int date, string version, int action)
Called after configuration data is saved to storage.
id is the saved configuration id set by CookieId. date is the saved configuration date in milliseconds since 1/1/1970.
action = 1 - save, 2 - delete.
API event bool

OnSaveCookieError

(Grid grid, Source source, int code, string message)
Called when loading of server response failed. Return true to suppress error message and continue as successful.
source is the CookieUrl, it is always object and it is copy of the original object, but has no sense to change it.
The code and message are the same as OnLoadError.
API event bool

OnResetCookie

(Grid grid, string id)
Called before grid loads default configuration on reset cookie. Return true to cancel the reset.
If set id, loads this Sealed configuration, for "" loads default configuration.