News in version
TreeGrid Gantt chart SpreadSheet Examples Documentation Download Development Licensing Prices References Contacts Buy Try it free
Documentation
Search in documentation
TreeGrid versions compatibility

Changes log (txt file) Upgrading from 9.3 to 10.0 Upgrading from 5.9 to 6.0

Creating grid

Simple examples Basic information Creating grid Deleting grid Reloading grid Rendering grid Accessing grid by API

Data & communication
Data communication with server

Communication types AJAX communication AJAX SOAP envelope Submit communication Directly included data Data from JavaScript Cross domain / local load by JSONP Sessions (AJAX) Server response (AJAX) Synchronous communication (AJAX) Caching (AJAX) API (AJAX)

Download data

Settings for data download Layout XML structure Data XML structure

Upload data

Settings for data upload API for upload XML structure sent to server

Changing data from server

XML structure of download changes XML structure of request for a cell Synchronizing data with server

Input / output data formats

Complete list of tags Internal XML format Short XML format Extra short XML format DTD XML format JSON format

Cells
Cell basics

Cell type Cell format Dynamic format Dynamic type Cell value Reading / writing attributes by API Cell HTML Range or more values in one cell Cell with link URL Cell hint Cell tooltip / title Cell popup menu

Cell editing and changing values

Cell editability Defaults list Suggest list (auto complete) Changing cell value Mass cell change Clearing cells Editing cells Controlling <input> tag by JavaScript Input validation and restrictions Side checkbox Cell selecting

Calculations - cell formulas

Basics Formulas Mathematical functions Aggregate functions Special functions for actions Custom functions

Calculations - editable cell formulas

Basics Suggest list (auto complete) Actions for choosing cells 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 Custom functions

Cell side buttons

Introduction Right side Button Left side Icon

Cell spanning

Column span Row span Dynamic spanning

Cell style and color

Basic grid style Sizing and scaling - responsive design Dynamic cell style attributes Cell CSS class Cell background color Dynamic cell border Cell HTML style Row color alteration Cell mouse cursor

Cell types
Auto type - Auto String - Text, Lines & Pass
Number - Int & Float

Format Localization

Date and time - Date

Format Calendar component Dates dialog Localization

List & combo - Enum & Radio

Introduction Definition Related lists Enum specific Radio specific

Checkbox - Bool
Action button - Button

Introduction Basic clickable button Switch button Radio / tab button Menu button Combo switch button Combo radio / tab button Special Space rows with buttons

Panel with more buttons - Panel

Definition Standard fast panel Custom panel

HTML and special types

Html type Icon type Abs type List type Editable Link type Editable Img type DropCols type Upload File type

Columns

Column basics Column index Column visibility Column visibility menu Column selecting Column tree Column position and moving Column adding and copying Column deleting Column width Column API

Rows
Row basics

Rows by functionality Rows by position Row name Row id Row index

Default rows

Description Example of default rows Example of changing default row Attributes

Row tree

Tree attributes Actions & API for expand / collapse

Row identification

Setting row id attribute Row id attribute in tree Row id created from cell values API for row ids

Row visibility
Row adding and copying

Five ways of adding rows to grid Adding and copying restrictions Adding new empty rows Copying existing rows

Row deleting Row moving and dragging Row selecting Row height Row API Space rows
Features
Sorting rows

Sort settings Controlling sort position Comparing strings Sorting actions Sorting API

Grouping rows to tree

Group settings Creating groups Comparing strings Created group rows <D Group='1'/> User interface to choose grouping Grouping actions and API

Filtering rows

Filter settings Comparing strings User interface to choose filter Filter actions and API

Searching in rows and cells

Search settings User interface for search Search actions and API

Printing grid

Print settings Choosing items to print Page size Print API

Print / export to PDF

Introduction Client side settings Printing options Client side API Server side API Data sent from client to server

Export to Excel or CSV

Introduction Basic settings Communication with server Export API Client export Server export

Import from Excel

Basic settings Sheets manipulation

Copy & paste rows via clipboard

Copy & paste permissions Copying to clipboard Pasting from clipboard

Master - detail grids

Introduction External master - detail grids Nested master - detail grids Synchronizing grids Other attributes for master - detail

Pivot tables

Pivot attributes & API Pivot formulas

External objects (like Adobe Flash) Undo & Redo
Gantt and bar chart
Gantt objects

Gantt objects list Display settings Edit settings

Main bar

Definition of main bar and plans Main bar as Task Edit settings Main bar content and side html Tip on mouse hover Vertical position and height Style specific attributes API to manipulate Main bars Actions Side text (deprecated) Real Flow (deprecated)

Run bar

GanttRun Definition Extended definition Run bar as Task Edit settings Save format Selecting Run boxes Run box content and side html Tip on mouse hover Box identification Vertical position and height Style specific attributes Overlaid (Error) boxes Containers for more boxes Dragging - moving and resizing API to manipulate Run boxes Actions Run special formulas

Summary task

Main for Main Main for Run Editable Main Editable Run

Gantt icons - Flag & Point

Flag - icon with text Point - math points

Gantt display objects

Header - column captions Cell and column Background Vertical movable Line Mark & Progress line

Gantt zoom

Zoom options Chart size limits Zoom selection Paging in Gantt chart

Dependency, constraints & schedule

Introduction Data units Defining dependencies Dependency colors and shapes Changing dependencies Correcting dependencies Scheduling algorithm Project date constraints Task date constraints Critical path - Slack (Float)

Gantt calendars

Global base calendar Local calendar Calendar list Calendars dialog Other settings

Gantt resources

Resources list Resources assign Resources filter Resources calculations Availability chart Resource usage chart Generated resource usage chart

Gantt popup menu Gantt API
Line and XY points charts

Charts in grid cells Chart JSON definition Base chart settings Basic attributes Size Axis and caption Individual chart lines Data sources Visual settings API for standalone usage

Paging in large grids
Paging root rows

Paging types and attributes Auto adding root pages API for paging

Pager components

Side pager Side pager type Pages Side pager type Gantt Side pager type Custom Pager with navigation buttons & edit Pager as list of page indexes

Paging in tree

ChildPaging - load / render on expand MaxChildren - limit children count ChildParts - load / render on scroll

Paging columns

Paging types and attributes Auto adding column pages API for column paging

Server paging

Server paging for root rows Server communication in root paging Root paging in very large tables Server paging in tree Server communication in tree paging XML Request for Data in root paging XML Download Data in root paging XML Request for root Page / children XML Download root Page / children API for server paging

TreeGrid DLL/SO for server paging

Introduction Compatibility with TreeGrid control Using TreeGrid server DLL/SO ASP.NET C# ASP.NET VB PHP JSP Java TreeGrid server concepts Function reference Calculations

JSON menus and dialogs
JSON menu description JSON menu definition example
Menu settings

Base attributes Visual settings Key navigation Behavior Size and scroll

Menu item settings

Base attributes Clickable item Inactive caption Collapsible sub level Popup sub menu Columns Bool item Enum item Edit item

Custom menu in JavaScript

Show custom menu Custom menu position Custom menu advanced settings Custom menu JavaScript events Custom menu JavaScript methods

Calendar dialog Custom calendar & JavaScript events Custom dialog in JavaScript
Global grid settings
Grid size and scroll

Default behavior Maximize grid height and width Update size according to the content Let a user to control the grid size Widths of individual sections Other scrolling attributes and API

Media rules - responsive design
Grid cursor - Focus & hover

Focused cell and row Focused cell range Move and copy focused cells Filling cell values by dragging Tabulator navigation Key navigation Cursor look - focus & hover

Selecting rows, cells and columns

Selecting base Selecting rows Selecting cells Selecting columns

Global settings

Status messages Configuration menus Configuration menu - options Configuration menu - columns Configuration menu - print / PDF Configuration menu - export Default toolbar Language & regional setup (Text.xml) Useful API function Help file

Animations

Animations base Row animations Column animations Cell animations Animations for undo / redo Animations for server side changes Dialog animations

Grid configuration in cookies
Mouse & key events & actions

List of event handler types TreeGrid mouse events Mouse event names Key and mouse button prefixes Touch event names Event targets Assigning event actions / callbacks Event action parameters Calling actions from JavaScript Creating custom actions Focused vs. Actual cell TreeGrid key events JavaScript API events

Mouse API event TreeGrid files
Debugging and testing

Debug window Automated testing

Cell style and color

TreeGrid documentation

Basic grid style

Base grid styles are defined in ...Grid.css and ...Gantt.css in Styles/ directory (default is Standard for grid and White for Gantt).
new 6.0 <Cfg> string

Style

["Standard"] Can be saved to cookies, if set StyleLap='0'
Base TreeGrid style selection. The base TreeGrid style presets nearly all visual settings in TreeGrid except Gantt chart. It can be:
a) Name of the predefined style from Styles, e.g. "Standard" or "White". In this case no CSS attribute should be set.
b) Prefix for custom or predefined CSS style. All the CSS classes in the file must start by this prefix, e.g. "TS", "XX" or "MyCustomPrefix". For custom prefix the CSS attribute must be set to style file or directory, e.g. <Cfg Style='PR1' GanttStyle='PR2' CSS='../CSSPR/Grid.css' GanttCSS='../CSSPR/Gantt.css'/>
new 13.0 <Cfg> string

GanttStyle

["White"] Can be saved to cookies, if set StyleLap='0'
Used only if defined Gantt chart. TreeGrid style selection for Gantt chart. The TreeGrid Gantt style presets nearly all visual settings in the Gantt chart cells. It can be:
a) Name of the predefined style from GanttStyles, e.g. "Standard" or "White". In this case no GanttCSS attributes should be set.
b) Prefix for custom or predefined CSS style. All the CSS classes in the file must start by this prefix, e.g. "TS", "YY" or "MyCustomPrefix". For custom prefix the GanttCSS attribute must be set to style file or directory, e.g. <Cfg Style='PR1' GanttStyle='PR2' CSS='../CSSPR/Grid.css' GanttCSS='../CSSPR/Gantt.css'/>
new 6.0 chg 7.0 upd 13.0 <Cfg> string

CSS

[""]
Where the file with TreeGrid CSS style is located, it can be:
a) empty to load CSS file from default style location defined in Styles according to the Style.
b) CSS file path and name with original or custom CSS style. For example CSS='*Styles/BlackGrid.css' or CSS='../../../Grid/Compatible/Gradient/Grid.css'.
If the path starts by *, it is relative to Grid/ directory (new 13.0), otherwise it is relative to the actual page URL.
c) CSS directory name inside base /Grid directory. This directory must contain files Grid.css as the style definition. For example CSS="Compatible/Standard"
new 10.0 <Cfg> string

GanttCSS

[""]
Used only if defined Gantt chart. Where the file with TreeGrid Gantt CSS style is located, it can be:
a) empty to load CSS file from default style location defined in GanttStyles according to the GanttStyle.
Or if defined CSS as directory name, the GanttCSS is set to the same name.
Or if defined CSS as url and contains "Grids.css", the GanttCSS is set to the same url with replaced "Grid.css" by "Gantt.css".
b) CSS file path and name with original or custom CSS style. For example GanttCSS='*Styles/BlackGanttcss' or GanttCSS='../../../Grid/Compatible/Gradient/Gantt.css'.
If the path starts by *, it is relative to Grid/ directory (new 13.0), otherwise it is relative to the actual page URL.
c) CSS directory name inside base /Grid directory. This directory must contain file Gantt.css as the style definition. For example GanttCSS="Compatible/Standard".
new 13.0 <Cfg> string

Styles

[...]
List of available TreeGrid styles in JSON format.
Its structure is Styles="{prefix1:{Name:name1,CSS:url1},prefix2:{Name:name2,CSS:url2},...}",
where prefix is the style prefix like "TS" (will be used in Style attribute),
Name is the style name like "Standard" (will be shown in Toolbar Styles type cell or optionally in Style attribute),
CSS is the CSS style url (will be used in CSS attribute). If not set, the Name is used,
new 13.0 <Cfg> string

GanttStyles

[...]
List of available TreeGrid styles for Gantt chart in JSON format.
Its structure is GanttStyles="{prefix1:{Name:name1,CSS:url1},prefix2:{Name:name2,CSS:url2},...}",
where prefix is the style prefix like "GW" (will be used in GanttStyle attribute),
Name is the style name like "Standard" (will be shown in Toolbar Styles type cell or optionally in GanttStyle attribute),
CSS is the CSS style url (will be used in GanttCSS attribute). If not set, the Name is used,
new 13.0 <Space cell> string

Type

Type="

Styles

"
Shows list of TreeGrid CSS styles defined in <Cfg> Styles attribute, by default used on Toolbar.
If the cell value is 0, no style list is shown. Set <Toolbar Styles='0'/> to hide the default list on toolbar.
If the cell value is 1, it creates one space cell for every TreeGrid CSS style.
If the cell value is 2, it creates one combo with popup list with all TreeGrid CSS styles.
new 13.0 <Space cell> string

Type

Type="

GanttStyles

"
Shows list of TreeGrid CSS for Gantt chart styles defined in <Cfg> GanttStyles attribute, by default used on Toolbar.
If the cell value is 0, no style list is shown. Set <Toolbar Styles='0'/> to hide the default list on toolbar.
If the cell value is 1, it creates one space cell for every TreeGrid CSS style.
If the cell value is 2, it creates one combo with popup list with all TreeGrid CSS styles.
new 7.0 <Cfg> bool

SafeCSS

[ ]
If set to 1, switches TreeGrid CSS style to safe mode, to not be affected by any external CSS style attribute setting except with !important.
Set the SafeCSS to 1 if the grid style looks differently on your page than in our examples and you cannot find the problem or you cannot change the external style.
The grid rendering in Safe mode is for about 20-30% slower.
All grids on page share the SafeCSS setting, the SafeCSS value is chosen according to the first grid loading.
Default value for the attribute is empty, it means auto selection - the CSS mode is switched to safe if there is some CSS setting that affect TreeGrid layout by margin, padding, border or display. Remember, the first loaded grid on page does the selection.
chg 13.0 API method void

SetStyle

(string Style, string CSS, string GanttCSS, string GanttStyle, bool render)
Changes TreeGrid style and optionally re-renders grid to show the changes.
Style, CSS, GanttCSS (since 10.0), GanttStyle (since 13.0) are appropriate attributes Style, CSS and GanttCSS. CSS and GanttCSS should be null for predefined TreeGrid style.
upd 13.0 API event bool

OnSetStyle

(TGrid grid, string Style, string CSS, string GanttCSS, string GanttStyle)
Called before the style is loaded.
Return true to suppress loading the style.
Style, CSS, GanttCSS (since 10.0), GanttStyle (since 13.0) are appropriate attributes Style, CSS and GanttCSS.
upd 13.0 API event void

OnAfterSetStyle

(TGrid grid, string Style, string CSS, string GanttCSS, string GanttStyle)
Called after the style is loaded, but before any render is started.
Style, CSS, GanttCSS (since 10.0), GanttStyle (since 13.0) are appropriate attributes Style, CSS and GanttCSS.
new 8.0 <Cfg> string

DragCursor

[ "url(Drag.cur),default" ]
Mouse cursor shown during dragging. By default it shows the Drag.cur file located in /Grid/ directory.
new 8.0 <Cfg> string

NoDragCursor

[ "url(noDrag.cur),default" ]
Mouse cursor shown during dragging if no drop is possible. By default it shows the NoDrag.cur file located in /Grid/ directory.
new 9.1 <Cfg> bool

GlobalCursor

[0]
Set it to true to set dragging cursor to document to show it while dragging between grids.
new 9.1 <Cfg> bool

ExternalAlign

[0]
If set to 1, does not align the grid content and use alignment from outside.
Cannot be used with ResizingMain. It affects also SafeCSS, but there is shared for all grids.
new 8.0 <Cfg> int

ZIndex

CSS z-index value for the grid and all its popup dialogs, messages and cursors.
Set it, if the grid is placed inside some absolutely positioned container, e.g. some popup dialog. Set it higher than the z-index of the parent container.
It sets z-index for all the grid objects in range ZIndex ~ ZIndex+20.
Any popup grid (shown by ShowPopupGrid or Dates dialog) will get ZIndex+20.
new 13.0 <Cfg> bool

StyleDependencyModifier

[1]
If adds GGxDep class to the main grid tag.
Used in some CSS styles to modify boxes if dependencies are used in Gantt, e.g. in White style shifts box content to not overlay the dependency arrow / stub.

Sizing and scaling - responsive design

new 13.0 <Cfg> string

Size

["Normal"] Saved to cookies except set SizeLap='1'
Chosen variant of actual CSS style. It can be comma separated list of CSS class names that are added (with prefix) to the TreeGrid main tags and dialog parents to modify actual CSS style.
For example Size="Small,Low" for Style="TS" and GanttStyle="GW" adds CSS classes "TSSmall", "TSLow", "GWSmall" and "GWLow" to the TreeGrid main tags. And the CSS style can change itself like: .TSSmall * { font-size:10px; }
The Size modifiers usually changes size of the CSS style items, but can change also anything else, e.g. color schema.
Or it can be one of the names in Sizes list to use its assigned classes value.
new 13.0 <Cfg> string

Sizes

[...]
List of available TreeGrid style sizes in JSON format.
Its structure is Sizes="{name1:'classes1',name2:'classes2',...}",
where name is the style name shown in Toolbar Sizes type cell.) and classes is comma separated list of CSS classes assigned to the Size attribute.
new 13.0 <Space cell> string

Type

Type="

Sizes

"
Shows list of TreeGrid CSS styles sizes defined in <Cfg> Sizes attribute, by default used on Toolbar.
If the cell value is 0, no style sizes list is shown. Set <Toolbar Sizes='0'/> to hide the default list on toolbar.
If the cell value is 1, it creates one space cell for every TreeGrid CSS style size.
If the cell value is 2, it creates one combo with popup list with all TreeGrid CSS style sizes.
new 13.0 API method void

SetSize

(string size)
Changes the grid Size to size value and rerenders the grid.
new 13.0 <Cfg> float

Scale

Saved to cookies except set ScaleLap='1'
If set, it scales the grid by given zoom factor, for < 1.0 shrinks, for > 1.0 magnifies.
Since 13.0 TreeGrid can be placed to parent tag that has CSS transform: scale(). This scale is independent on the Scale and both ways can be used also together.
It does not affect menus, dialogs and messages, see ScaleMenu.
It is not related to Gantt zoom, to scale Gantt chart use GanttZoom.
new 13.0 <Cfg> float

ScaleMenu

If set, it scales the grid menus, dialogs and messages by given zoom factor, for < 1.0 shrinks, for > 1.0 magnifies.
If set to negative value it is taken as positive and also multiplied by Scale and any grid parent transform: scale() value.
new 13.0 <Cfg> string

Scales

[...]
List of available TreeGrid scales in JSON format.
Its structure is Scales="{name1:scale1,name2:scale2,...}",
where name is the style name shown in Toolbar Scales type cell.) and scale is set to the Scale attribute.
new 13.0 <Space cell> string

Type

Type="

Scales

"
Shows list of TreeGrid CSS scales defined in <Cfg> Scales attribute, by default used on Toolbar.
If the cell value is 0, no scales list is shown. Set <Toolbar Scales='0'/> to hide the default list on toolbar.
If the cell value is 1, it creates one space cell for every TreeGrid CSS scale.
If the cell value is 2, it creates one combo with popup list with all TreeGrid CSS scales.
new 13.0 API method void

SetScale

(float scale)
Changes the grid Scale to scale value and updates the grid size.
new 13.0 chg 13.1 <Cfg> int

ShrinkStyle

[3] Saved to cookies
If it changes Size to smaller value from Sizes and / or Scale to smalled value from Scales, if there is not enough room to display the grid readable.
0 - never, 1 - always, 2 - ask user, 3 (new 13.1, set as default) - minimal (only to display grid).
new 13.0 <Cfg> int

ShrinkStyleType

[31]
When it changes Size to smaller value from Sizes and / or Scale to smalled value from Scales, if there is not enough room to display the grid readable. Bit array.
It is applied before LimitScroll.
1. bit &1 - Horizontal limit. Shrinks if the width of any column section is lower than the MinLeftWidth / MinMidWidth / MinRightWidth value.
2. bit &2 - Vertical limit. Shrinks if the height of visible variable rows count is smaller than MinBodyRows value.
3. bit &4 - Space width limit. Shrinks if any Space row does not display all its cells fully because too small grid width.
4. bit &8 - Pager height limit. Shrinks pager only, if it shows vertical scrollbar. It does not change the StyleSize in this case. Not affected by ShrinkSize. Ignored if set SafeCSS=1.
5. bit &16 - Decrease Scale, if the style size cannot be more reduced. To reduce only Scale set empty ShrinkStyleWidth and ShrinkStyleHeight.
6. bit &32 - Save the automatically changed Size and Scale to cookies.
new 13.0 <Cfg> int

MinBodyRows

[5]
Minimal count of variable rows to be displayed, for ShrinkStyleType 2. bit.
The row height is taken as minimal row height set in actual style and style size or by MinRowHeight.
new 13.0 <Cfg> string[]

ShrinkStyleWidth

["Mini,Small,Low,Normal,High"]
Comma separated list of style size names that be used when shrinking horizontally by ShrinkStyle, ShrinkStyleType 1. bit. If not defined, all style sizes from Sizes are used.
new 13.0 <Cfg> string[]

ShrinkStyleHeight

Comma separated list of style size names that be used when shrinking vertically by ShrinkStyle, ShrinkStyleType 2. bit. If not defined, all style sizes from Sizes are used.
new 13.0 <Cfg> string[]

ShrinkStyleScale

Comma separated list of Scale value that be used when decreasing scale by ShrinkStyle, ShrinkStyleType 5. bit. If not defined, all scales from Scales are used.
new 13.0 <Space cell> int

LastVisible

[...]
Last cell in space row to be visible, for ShrinkStyleType 4. bit.
Default value is "Cfg" for default Toolbar and empty for other space rows.

Dynamic cell style attributes

Cell styles used only if set <Cfg DynamicStyle/>. Otherwise the look can be preset by Class attribute.
All style attributes are read from row before column.
new 12.0 <Cfg> string

DynamicStyle

[ ]
Permits individual cell style attributes to set the CSS styles directly instead of using Class attribute.
0 - off, all attributes are ignored
1 - on, but sets NoStyle = 1 for all fixed rows and columns.
2 - on
empty - by default for backward compatibility there are enabled attributes Color, Wrap, Align, VAlign and Rotate in all cells only statically and other attributes are disabled.
The DynamicStyle affects also background Color attribute, but not Background.
new 12.0 <C> int

NoStyle

[0/2]
If the style attributes will be read for the cells in the column.
0 - all, 1 - all except styles set for whole row, 2 none dynamically, 3 none.
By default it is 2 for Index, Panel and ConstWidth columns and 0 for other rows.
new 12.0 <I> int

NoStyle

[0/2]
If the style attributes will be read for the cells in the row.
0 - all, 1 - all except styles set for whole column, 2 none dynamically, 3 none.
By default it is 3 for Header and Panel rows and 0 for other rows.
new 12.0 <C><I><cell> int

TextStyle

CSS settings for font-weight, font-style, font-variant and text-decoration, bit array.
1. bit &1 Bold, 2. bit &2 Italic, 3. bit &4 Underline, 4. bit &8 Strike, 5. bit &16 Overline, 6. bit &32 Small caps.
new 12.0 <Actions>

BoldOn

,

BoldOff

,

BoldOnCells

,

BoldOffCells

,

BoldOnSelected

,

BoldOffSelected ...F

Attached to OnClickButtonBold event
Changes TextStyle bit 1 in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

ItalicOn

,

ItalicOff

,

ItalicOnCells

,

ItalicOffCells

,

ItalicOnSelected

,

ItalicOffSelected ...F

Attached to OnClickButtonItalic event
Changes TextStyle bit 2 in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

UnderlineOn

,

UnderlineOff

,

UnderlineOnCells

,

UnderlineOffCells

,

UnderlineOnSelected

,

UnderlineOffSelected ...F

Attached to OnClickButtonUnderline event
Changes TextStyle bit 3 in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

StrikeOn

,

StrikeOff

,

StrikeOnCells

,

StrikeOffCells

,

StrikeOnSelected

,

StrikeOffSelected ...F

Attached to OnClickButtonStrike event
Changes TextStyle bit 4 in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

OverlineOn

,

OverlineOff

,

OverlineOnCells

,

OverlineOffCells

,

OverlineOnSelected

,

OverlineOffSelected ...F

Not attached to any event
Changes TextStyle bit 5 in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

SmallCapsOn

,

SmallCapsOff

,

SmallCapsOnCells

,

SmallCapsOffCells

,

SmallCapsOnSelected

,

SmallCapsOffSelected ...F

Not attached to any event
Changes TextStyle bit 6 in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

NoTextStyle

,

NoTextStyleCells

,

NoTextStyleSelected ...F

Not attached to any event
Sets null to TextStyle in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <C><I><cell> string

TextColor

Color of the text. Can be any CSS color.
new 12.0 <Cfg> string

TextColor

["red"]
Predefined text color set by actions SetTextColor... to cell TextColor attribute
new 12.0 <Cfg> string[*]

TextColors

[...]
Predefined text colors set by actions ChooseTextColor... to cell TextColor attribute. First character separated array. Format is "|value1|name1|value2|name2|..."
The value is set to cell TextColor if chosen menu item name. value can be any CSS color definition or empty. name can be empty to show the value as menu item.
Default value is "|red||green||blue||brown||maroon||gray|||none".
new 12.0 <Actions>

SetTextColor

,

SetTextColorCells

,

SetTextColorSelected ...F

Attached to OnClickButtonColorText event
Sets value of global TextColor to TextColor in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

ChooseTextColor

,

ChooseTextColorCells

,

ChooseTextColorSelected ...F

Attached to Toolbar cell ColorText OnClickPopup event
Shows menu with items in global TextColors. If used in Menu, shows submenu with the global TextColors.
And sets the chosen color to TextColor in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

NoTextColor

,

NoTextColorCells

,

NoTextColorSelected ...F

Not attached to any event
Sets null to TextColor in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <C><I><cell> string

TextSize

Size of the text font in pixels. Or can contain the unit suffix like in CSS. ("10" means 10px, but can be set also "10px" or "10em" or "10pt" etc.
new 12.0 <Cfg> string

TextSize

["14"]
Predefined font size set by actions SetTextSize... to cell TextSize attribute
new 12.0 <Cfg> string[*]

TextSizes

[...]
Predefined font sizes set by actions ChooseTextSize... to cell TextSize attribute. First character separated array. Format is "|value1|name1|value2|name2|..."
The value is set to cell TextSize if chosen menu item name. value can be any CSS font-size definition or empty. name can be empty to show the value as menu item.
Default value is "|8px|smallest|9px|smaller|10.5px|small||normal|14px|large|17px|larger|22px|largest".
new 12.0 <Actions>

SetTextSize

,

SetTextSizeCells

,

SetTextSizeSelected ...F

Attached to Toolbar button Size OnChange and OnSame events
Sets value of global TextSize to TextSize in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

ChooseTextSize

,

ChooseTextSizeCells

,

ChooseTextSizeSelected ...F

Not attached to any event
Shows menu with items in global TextSizes. If used in Menu, shows submenu with the global TextSizes.
And sets the chosen size to TextSize in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

NoTextSize

,

NoTextSizeCells

,

NoTextSizeSelected ...F

Not attached to any event
Sets null to TextSize in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <C><I><cell> string

TextFont

Font family name. Can be any CSS font-family name. If the name contains spaces, it should be double quoted.
new 12.0 <Cfg> string

TextFont

["'Times New Roman',serif"]
Predefined font name/family set by actions SetTextFont... to cell TextFont attribute
new 12.0 <Cfg> string[*]

TextFonts

[...]
Predefined font names/families set by actions ChooseTextFont... to cell TextFont attribute. First character separated array. Format is "|value1|name1|value2|name2|..."
The value is set to cell TextFont if chosen menu item name. value can be any CSS font-family definition or empty. name can be empty to show the value as menu item.
Default value is "|'Microsoft Sans Serif',Tahoma,'Trebuchet MS',sans-serif|sans serif|'Times New Roman',serif|serif|'Courier New',monospace|monospace||default".
new 12.0 <Actions>

SetTextFont

,

SetTextFontCells

,

SetTextFontSelected ...F

Not attached to any event
Sets value of global TextFont to TextFont in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

ChooseTextFont

,

ChooseTextFontCells

,

ChooseTextFontSelected ...F

Not attached to any event
Shows menu with items in global TextFonts. If used in Menu, shows submenu with the global TextFonts.
And sets the chosen font to TextFont in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

NoTextFont

,

NoTextFontCells

,

NoTextFontSelected ...F

Not attached to any event
Sets null to TextFont in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <C><I><cell> int

TextShadow

[0]
A shadow displayed behind or in front of the original text. There are predefined 0 - 9 shadows, more shadows can be added in Grid.css, GxTextShadowXX.
The shadow value 0 (default) is used only if the TextShadowColor is set.
Use it for visual effects for the text. In IE it works only for versions higher than 9.
new 12.0 <Cfg> int

TextShadow

[1]
Predefined text shadow number set by actions SetTextShadow... to cell TextShadow attribute
new 12.0 <Cfg> string[*]

TextShadows

[...]
Predefined text shadow numbers set by actions ChooseTextShadow... to cell TextShadow attribute. First character separated array. Format is "|value1|name1|value2|name2|..."
The value is set to cell TextShadow if chosen menu item name. value can be any number 0 - 9 or empty. name can be empty to show the value as menu item.
Default value is "|0|default background|1|bold|2|bold with ghost|3|bold with background|4|bold with light background|5|ghost|6|ghost with bold|7|dark background|8|background with bold|9|light background".
new 12.0 <Actions>

SetTextShadow

,

SetTextShadowCells

,

SetTextShadowSelected ...F

Not attached to any event
Sets value of global TextShadow to TextShadow in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

ChooseTextShadow

,

ChooseTextShadowCells

,

ChooseTextShadowSelected ...F

Not attached to any event
Shows menu with items in global TextShadows. If used in Menu, shows submenu with the global TextShadows.
And sets the chosen shadow to TextShadow in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

NoTextShadow

,

NoTextShadowCells

,

NoTextShadowSelected ...F

Not attached to any event
Sets null to TextShadow in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <C><I><cell> string

TextShadowColor

Color of the shadow selected by TextShadow.
If used without TextShadow (for its value 0), it displays default shadow in selected color as direct background of the text.
new 12.0 <Cfg> string

TextShadowColor

["#FF0"]
Predefined text shadow color set by actions SetTextShadowColor... to cell TextShadowColor attribute
new 12.0 <Cfg> string[*]

TextShadowColors

[...]
Predefined text shadow colors set by actions ChooseTextShadowColor... to cell TextShadowColor attribute. First character separated array. Format is "|value1|name1|value2|name2|..."
The value is set to cell TextShadowColor if chosen menu item name. value can be any CSS color definition or empty. name can be empty to show the value as menu item.
Default value is "|black||red||green||blue||brown||maroon||gray||yellow||lime||aqua||pink||orange||silver|||none".
new 12.0 <Actions>

SetTextShadowColor

,

SetTextShadowColorCells

,

SetTextShadowColorSelected ...F

Attached to OnClickButtonColorShadow event
Sets value of global TextShadowColor to TextShadowColor in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

ChooseTextShadowColor

,

ChooseTextShadowColorCells

,

ChooseTextShadowColorSelected ...F

Attached to Toolbar button ColorShadow OnClickPopup event
Shows menu with items in global TextShadowColors. If used in Menu, shows submenu with the global TextShadowColors.
And sets the chosen color to TextShadowColor in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

NoTextShadowColor

,

NoTextShadowColorCells

,

NoTextShadowColorSelected ...F

Not attached to any event
Sets null to TextShadowColor in actual or focused cell or in all focused cells or in all selected cells.
new 6.0 <C><I><cell> bool

Wrap

[0/1]
If the cell content will be wrapped.
By default it is 1 for types Html, Lines, List and 0 for other types and Header.
new 13.3 <Cfg> bool

WordWrap

[1]
If long words in wrapped cells can be wrapped too.
new 13.3 API method void

SetWordWrap

(bool wrap)
Changes WordWrap attribute value and shows the changes.
new 12.0 <Actions>

WrapOn

,

WrapOnCells

,

WrapOnSelected ...F

Attached to OnClickButtonWrap event
Sets 1 to Wrap attribute in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

WrapOff

,

WrapOffCells

,

WrapOffSelected ...F

Attached to OnClickButtonWrap event
Sets 0 to Wrap attribute in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

NoWrap

,

NoWrapCells

,

NoWrapSelected ...F

Not attached to any event
Sets null to Wrap attribute in actual or focused cell or in all focused cells or in all selected cells.
new 6.0 upd 9.3 <C><I><cell> bool

Align

["Left" / "Right"]
How the cell content will be aligned. Case insensitive keyword: "Left", "Right", "Center", "Justify", "Scroll".
By default it is "Right" for types Int, Float, Date and "Left" for other types.
The Justify works only for more lines text except the last line.
The side Button is not rotated, use side Icon instead. For example for Date type set Icon='Date' IconAlign='Right'
(Since 9.3) The Scroll moves the position of the text on scroll to be always visible if at least a part of the cell is visible. Usable especially for spanned cells.
Using too many cells with Align="Scroll" can slow down the grid scrolling!
new 12.0 <Actions>

AlignLeft

,

AlignLeftCells

,

AlignLeftSelected ...F

Attached to OnClickButtonLeft event
Sets "Left" to Align attribute in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

AlignRight

,

AlignRightCells

,

AlignRightSelected ...F

Attached to OnClickButtonRight event
Sets "Right" to Align attribute in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

AlignCenter

,

AlignCenterCells

,

AlignCenterSelected ...F

Attached to OnClickButtonCenter event
Sets "Center" to Align attribute in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

NoAlign

,

NoAlignCells

,

NoAlignSelected ...F

Not attached to any event
Sets null to Align attribute in actual or focused cell or in all focused cells or in all selected cells.
new 11.0 <C><I><cell> string

VAlign

[""]
Vertical alignment of the cell content, including side buttons and icons.
Possible value: top, middle, bottom.
To vertically align tree buttons, you have also to set <Cfg NoTreeLines='2'/>.
By default are all the cells aligned to top.
Setting this attribute to any value including "top" renders cells with more tags and can slow down the grid.
Setting this attribute forces setting ClassInnerIcon='1' FastPanel='0'.
Set the VAlign="top" for rows higher than 250px to correctly display icon images.
For cell with Rotate cell use Align to vertically align the cell.
new 12.0 <Actions>

VAlignTop

,

VAlignTopCells

,

VAlignTopSelected ...F

Attached to OnClickButtonTop event
Sets "Top" to VAlign attribute in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

VAlignBottom

,

VAlignBottomCells

,

VAlignBottomSelected ...F

Attached to OnClickButtonBottom event
Sets "Bottom" to VAlign attribute in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

VAlignMiddle

,

VAlignMiddleCells

,

VAlignMiddleSelected ...F

Attached to OnClickButtonMiddle event
Sets "Middle" to VAlign attribute in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

NoVAlign

,

NoVAlignCells

,

NoVAlignSelected ...F

Not attached to any event
Sets null to VAlign attribute in actual or focused cell or in all focused cells or in all selected cells.
new 6.6 upd 12.0 <C><I><cell> int

Rotate

[0]
Rotates text in the cell. It does work only in IE 6+, FF 3.5+, Opera 10.5+, Safari 4+, Chrome 4+.
1 - text is from bottom to top, 2 - text is from top to bottom, 3 - (since 9.1) like 2 for IE and 1 for other browser, because 1 is better readable but slow in IE.
Since 12.0 it can be set also to whole row or column.
Don't set it to too many cells, it is intended to use especially in header. It can remarkably slow down the grid!
new 12.0 <Actions>

RotateLeft

,

RotateLeftCells

,

RotateLeftSelected ...F

Attached to OnClickButtonRotateLeft event
Sets 1 to Rotate attribute in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

RotateRight

,

RotateRightCells

,

RotateRightSelected ...F

Attached to OnClickButtonRotateLeft event
Sets 2 to Rotate attribute in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 <Actions>

NoRotate

,

NoRotateCells

,

NoRotateSelected ...F

Attached to OnClickButtonRotateLeft and OnClickButtonRotateRight events
Sets null to Rotate attribute in actual or focused cell or in all focused cells or in all selected cells.
new 13.0 <C><I><cell> int

Indent

[0]
Indent of the cell value. For right aligned from right edge, otherwise from left edge. One indent step is 10px, can be changed in CSS.
new 13.0 <Cfg> int

Indent

[1]
Predefined indent set by actions SetIndent... to cell Indent attribute
new 13.0 <Cfg> string[*]

Indents

[...]
Predefined indents set by actions ChooseIndent... to cell Indent attribute. First character separated array. Format is "|value1|name1|value2|name2|..."
The value is set to cell Indent if chosen menu item name. value is a number as the indent size or empty. name can be empty to show the value as menu item.
Indents="||<span style='font-size:9px;color:silver;'>indent</span>|0|0|1|1|2|2|3|3|4|4|5|5|6|6|7|7|8|8|9|9|10|10|15|15|20|20|25|25|30|30|35|35|40|40|45|45|50|50"
new 13.0 <Actions>

SetIndent

,

SetIndentCells

,

SetIndentSelected ...F

Attached to Toolbar button TextIndent OnChange and OnSame events
Sets value of global Indent to Indent in actual or focused cell or in all focused cells or in all selected cells.
new 13.0 <Actions>

ChooseIndent

,

ChooseIndentCells

,

ChooseIndentSelected ...F

Not attached to any event
Shows menu with items in global Indents. If used in Menu, shows submenu with the global Indents.
And sets the chosen indent to Indent in actual or focused cell or in all focused cells or in all selected cells.
new 13.0 <Actions>

NoIndent

,

NoIndentCells

,

NoIndentSelected ...F

Not attached to any event
Sets null to Indent in actual or focused cell or in all focused cells or in all selected cells.
new 12.0 API event type

OnGetCellStyle

(TGrid grid,TRow row, string col, string attr, type value)
Called to get individual cell style attribute dynamically. It is not called to get Color.
attr is attribute name, value is predefined value. Return new value or null to ignore.
new 12.0 API method type

GetCellStyleAttribute

(TRow row, string col, string attr)
Returns given style attribute attr from the cell.
It reads it also from row and column and calls OnGetCellStyle. To read just the cell attribute value use Get (row,col+attr) instead.
new 12.0 API method bool

SetCellStyle

(TRow row, string col, object attrs, bool refresh = 0)
Sets given attributes to cell. If row is null, sets them to column, if the col is null, sets them to row.
attrs is JavaScript object as named array, attribute = value, for example {Color:"red",TextColor:"blue",TextStyle:27}.
The attrs can contain all dynamic cell attributes in this section and Color.
If set refresh, refreshes all the cells to show the changes.
It saves the change to undo, if the undo is permitted.
Returns true for success, false if NoStyle restricts setting the cell.

Cell CSS class

new 6.0 <C><I><cell> string

Class

A CSS class name(s) applied to the cell.
To set background colors use rather Background or Color attribute or you must use !important modifier, because background colors are set also by grid.
Remember, the cell already contains its basic CSS definition, so this class must be defined after the included Grid.css file or use !important modifier.
Attention, not all CSS setting can be modified (e.g overflow), always test the result if it does not break down grid layout.
chg 6.0 <C><I><cell> string

ClassInner

If set, it adds new inner <DIV> with this class to the cell. Wrap and Align and type classes are applied to this <DIV> instead of the cell itself.
Use ClassInner to add some inner border and margin to the cell, for other settings use Class attribute instead.
Remember, setting ClassInner for many cells can slow down the grid rendering and usage!
chg 6.0 <C><I><cell> bool

ClassInnerIcon

[0/1]
When used left side Icon and ClassInner, if the icon will be inside the ClassInner <DIV>.
The default value is 0. If set VAlign attribute, the value is 1 and cannot be changed.
The right side Button is always outside.
new 6.0 <Cfg> bool

UsePrefix

If set to 1, inserts the <Cfg Style/> attribute value before every custom Class and ClassInner attribute, in this case the Class must contain only one CSS class name.
Set it to 1 to differ between TreeGrid styles - for every supported style you can define different custom classes.
chg 6.0 API event string

OnGetClass

(TGrid grid, TRow row, string col, string cls)
Called to get custom class name(s) for the cell.
cls is the custom class name(s) for the cell set by Class attribute.
Return null to not change the class or return new class name(s).

Cell background color

Default row and cell backgrounds are defined in the style in Grid.css file. Also state colors are defined there.
upd 12.0 <C><I><cell> string

Color

Predefined base background color for cell, used instead of CSS Default color.
This color is modified by all row and cell state colors, so it preserves the row state highlight!
It can be set as "240,240,240" or "rgb(240,240,240)" or "#F0F0F0" or "#FFF" or to basic 16 color names (black, red, green, ...)
The color "255,255,255" is transparent color, so it displays background color of its parent if no state color is computed.
Since 12.0 it is affected by DynamicStyle.
If the DynamicStyle is set to 0, the Color is ignored.
If the DynamicStyle is set to 1 or 2, the Color can be dynamically changed by SetCellStyle, is affected by NoStyle and is read from row before column.

new 12.0 <Cfg> string

DefaultColor

["#FF0"]
Predefined text color set by actions SetColor... to cell Color attribute
new 12.0 <Cfg> string[*]

DefaultColors

[...]
Predefined background colors set by actions ChooseColor... to Color attribute. First character separated array. Format is "|value1|name1|value2|name2|..."
The value is set to cell Color if chosen menu item name. value can be CSS color as "#RGB" or "#RRGGBB" or "rgb(R,G,B)" definition or empty. name can be empty to show the value as menu item.
Default value is "|#FF0|yellow|#0F0|lime|#0FF|aqua|#FCC|pink|#FA0|orange|#CCC|silver||none".
new 12.0 <Actions>

SetColor

,

SetColorCells

,

SetColorSelected ...F

Attached to OnClickButtonColorBackground event
Sets value of global DefaultColor to Color in actual or focused cell or in all focused cells or in all selected cells.
Used only if DynamicStyle is set.
new 12.0 <Actions>

ChooseColor

,

ChooseColorCells

,

ChooseColorSelected ...F

Attached to Toolbar button ColorBackground OnClickPopup event
Shows menu with items in global Colors. If used in Menu, shows submenu with the global Colors.
And sets the chosen color to Color in actual or focused cell or in all focused cells or in all selected cells.
Used only if DynamicStyle is set.
new 12.0 <Actions>

NoColor

,

NoColorCells

,

NoColorSelected ...F

Not attached to any event
Sets null to Color in actual or focused cell or in all focused cells or in all selected cells.
Used only if DynamicStyle is set.
new 6.0 <C><I><cell> string

Background

Background color for the cell.
This color overrides any state and type background color of the row, so it hides any row state!
It can be set as "240,240,240" or "rgb(240,240,240)" or "#F0F0F0" or "#FFF" or to basic 16 color names (black, red, green, ...)
The color "255,255,255" is transparent color, so it displays background color of its parent.
upd 6.0 <C><I><cell> int

NoColor

If set to 1, the cell is not colored at all, all state and custom colors (Color, Background) are ignored - you can use CSS style background for the cell.
If set to 2, the cell state and type colors are ignored.
new 12.0 <Cfg> int

ColorState

[63]
If the cell / row / column state change will be colored, bit array.
1. bit &1 If the changed cells will be colored.
2. bit &2 If the added, deleted, moved and changed rows will be colored.
3. bit &4 If the added and deleted columns will be colored.
4. bit &8 If the cell permissions (edit/readonly/preview/nofocus) will be colored.
5. bit &16 If the cell with editable formulas will be colored.
6. bit &32 If the cell with Error will be colored.
By default all options are colored.
<I> bool

NoColorState

If set to 1, does not change background color for changed, added, moved and deleted row.
Useful to set for some control rows that will not be uploaded to server.
upd 6.0 API event string

OnGetColor

(TGrid grid, TRow row, string col, int r, int g, int b)
Called to get final color of the cell. r, g, b are predefined colors for this state.
Can return null to use r,g,b values unchanged.
The returned color is the resulted color for the cell or row and is directly assigned to the cell.
The returned color must be in CSS format like "blue" or "#FFF" or "rgb(r,g,b)".
upd 6.0 API event int

OnGetDefaultColor

(TGrid grid, TRow row, string col, int r, int g, int b)
Called to get default color for the cell or row. r, g, b are predefined colors for this state.
Returns new integer #RRGGBB color or null to use default.
The returned color is modified according to row state.
API method void

ColorRow

(TRow row)
Re-colors row according to its state and color settings. It does not update the class.
API method void

ColorCell

(TRow row, string col)
Re-colors cell according to its state and color settings. It does not update the class.

Dynamic cell border

If set <Cfg DynamicBorder/>, every cell can have different border color, style and width defined by cell Border attribute. But the borders are shared between adjacent cells - adjacent cells have the same border edge color, style and width.
If the DynamicBorder is not set, every cell can have different border color and style defined by cell Class attribute. But all cells must have the same border width, defined by the used TreeGrid CSS style.
new 12.0 <Cfg> int

DynamicBorder

[0]
Sets the cell dynamic border to use in the grid.
0 - off, 1 - for variable rows and middle columns only 2 - for all rows and columns.
If set, the cell border can be defined by Border attribute. And can be dynamically changed by API method SetBorder.
If set, all the affected cells get 2px border top and left and 1px border bottom and right. This cell border is usually transparent.
Using dynamic cell borders can slow down the grid refresh. It can also slightly modify the grid look, it increases the cell size by the border.
new 12.0 <Cfg> int

SpannedBorder

[3]
How the cell border is rendered for spanned cells, if the border cannot be shared due the cell edge length difference or shift.
Due the border implementation the cell share their border, therefore spanned cells cannot share their border fully, if the span is different.
1+2. bit, &30 - The border part is hidden. It leads to missing border parts.
1 - The border part width is changed to be shown for the cell always. The top and left edges are always 2px wide and the bottom and right edges are always 1px wide.
2 - Like 1 and removes the changed border edge from adjacent cell, even if it could show it correctly.
3 - Like 2 and it is used also for grid outside edges.
3. bit, &4If set, spanned cell shows its right and bottom border.
If not set, right border is read from top right cell and bottom border from bottom left cell.
new 13.0 <Cfg> bool

DefaultBorder

[1] Saved to cookies, avoid it by <Cfg DefaultBorderLap='1'/>
If the grid with DynamicBorder displays standard cell border from chosen CSS style.
new 13.3 <Cfg> bool

ResetNextBorder

[1]
If set, all border setting actions and API reset adjacent border of the next right and bottom cells to ensure all the borders are set.
If not set and the next right cell has set left border and / or next bottom cell has set top border, these borders are preferred and hide actually set borders of the left / top cell.
new 12.0 <C> int

NoBorder

[0/3]
If the border will be shown for the cells in the column.
0 - all, 1 - all except border set for whole row, 2 none dynamically, 3 none.
By default it is 3 for Index, Panel and ConstWidth columns and 0 for other rows.
new 12.0 <I> int

NoBorder

[0/3]
If the border will be shown for the cells in the row.
0 - all, 1 - all except border set for whole column, 2 none dynamically, 3 - none and for fixed rows the border space is also not reserved in the row cells.
By default it is 3 for Header and Panel rows and 0 for other rows.
new 12.0 <C><I><cell> string[]

BorderTop

,

BorderRight

,

BorderBottom

,

BorderLeft

One cell border edge. Format comma separated 3 values as "width,color,priority". For example BorderLeft="3,red" BorderTop="1,blue,2" BorderBottom="1".
If the border is not set or it is empty, it shows default cell border.
The width is the border width and style, it can be:
0 - transparent border - no border is shown,
1 - 1px solid, 2 - 2px solid, 3 - 3px solid,
4 - 1px dotted, 5 - 2px dotted,
6 - 1px dashed, 7 - 2px dashed,
The color can be any CSS color name or code like red or #FF0000. If empty, black color is used.

To priority is a number to choose one border if more borders are defined for the same cell edge.
If adjacent cells define the same border edge, the cell with higher priority is preferred. For the same priority, the cell on right or bottom side is preferred.
If the Border attribute is defined for both cell and/or row and/or column, the value with higher priority is used. For the same priority the priority order is (high->low): cell, row, column.

For spanned cells the top and left border is read from the spanned (top left) cell.
The right border is read from top right cell and the bottom border is read from bottom left cell, except SpannedBorder has set 4.
If the spanned cell edge row or column is hidden, the left and top border is read from the next bottom cell.
The right border is read from the next left cell and the bottom border from next top cell, except SpannedBorder has set 4.
new 12.0 <Cfg> string[]

BorderOut

["3,black"]
Predefined border to be set by SetBorder... actions as outer cell border in cell range.
Contains up to 4 comma separated values as "width,color,priority,edge".
new 12.0 <Cfg> string[]

BorderIn

["1,black"]
Predefined border to be set by SetBorder... actions as inner cell border in cell range.
Contains up to 4 comma separated values as "width,color,priority,edge".
new 12.0 <Cfg> int

BorderType

[0]
Which rows and columns are affected by setting and clearing borders, bit array.
1.bit (&1)Include deleted rows and columns.
2.bit (&2)Include filtered rows and columns.
3.bit (&4)Include manually hidden rows and columns
4.bit (&8)Include children in collapsed parents
new 12.0 <Cfg> int

BorderColors

[...]
Predefined text shadow colors set by actions ChooseBorderColor... to cell border. First character separated array. Format is "|value1|name1|value2|name2|..."
The value is set to cell border if chosen menu item name. value can be any CSS color definition or empty. name can be empty to show the value as menu item.
Default value is "|black||red||green||blue||brown||maroon||gray||yellow||lime||aqua||pink||orange||silver||none".
new 12.0 API method string[]

GetBorder

(TRow row, string col, int edge = 15)
Returns parsed Border... attributes for given cell, as JavaScript 2D array in format:
[[topwidth,topcolor,toppriority],[rightwidth,rightcolor,rightpriority],[bottomwidth,bottomcolor,bottompriority],[bottomwidth,bottomcolor,bottompriority]].
The array item can be null if the border edge is not set or required by edge.
edge is bit array to specify which border to read: 1 top, 2 right, 4 bottom, 8 left. Set it to 15 to get them all.
new 12.0 API method void

SetBorder

(TRow row, string col, type border, int edge = 15, int refresh = 1, int span = 0)
Sets given border to specified cell Border... attributes and refreshes the cell border.
The border can be string as "width,color,priority" or JavaScrit array as [width,color,priority] or null to clear the border.
edge - which border edge will be set, bit array: 1 top, 2 right, 4 bottom, 8 left. Set it to 15 to set them all.
refresh - if and when the cell is refreshed, 0 - no, sets only the attribute, 1 - refresh only changed edges, 2 refresh always.
span how sets and refreshes spanned cell
0 - for main cell sets the left and top border to main cell, right border to top right cell and bottom border to bottom left cell. Ignores all hidden spanned cells.
1 - like 0, but for hidden spanned cell sets and refreshes the main cell.
2 - sets the border always to given cell, including hidden spanned cells. Refreshes only it the cell is main cell.
3 - like 2, but refreshes also if the cell is top right or bottom left cell.
The shown cell border can be different than the one set because of the borders in adjacent cells.
new 12.0 API method void

RefreshBorder

(TRow row, string col, int edge = 15, int span = 0)
Refreshes the given cell border.
edge - which border edge will be refreshed, bit array: 1 top, 2 right, 4 bottom, 8 left. Set it to 15 to refresh them all.
span - for spanned cells; 0 or 2 - refreshes it only if it is main cell, 1 - refreshes always the main cell, 3 - refreshes it if it is main cell or top right or bottom left cell.
Note, neither the RefreshCell nor SetAttribute, nor SetValue refresh the cell border! And RefreshRow refreshes only the inner vertical borders.
new 12.0 API method void

SetBorders

(type[] range, type borderout = null, type borderin = null, int edge = 15)
Sets cell borders in the given range as [TRow row1, string col1, TRow row2, string col2].
edge - which border edge will be set, bit array: 1 top, 2 right, 4 bottom, 8 left. Set it to 15 to set them all.
borderout will be set to edge cells, only to their outside edges. It is ignored if set to null.
borderin will be set to every cell in the range, except the outside edges of edge cells. It is ignored if set to null.
The borderout and borderin can be string as "width,color,priority" or JavaScrit array as [width,color,priority] or null to clear the border.
new 12.0 API event type[]

OnGetBorder

(TGrid grid, TRow row, string col, type[] border, int edge)
Called to get one border edge of the cell.
edge - which border edge is required, bit array: 1 top, 2 right, 4 bottom, 8 left. Set it to 15 to set them all.
border is a border to be set. It is an array as [width,color,priority]. Can be null for empty border.
Return new border or null to ignore or empty string to not set any border.
new 12.0 <Actions>

ClearBorder ...F

Not attached to any event
Clears all four borders in actual or focused cell.
new 12.0 <Actions>

ClearBorderTop

,

ClearBorderBottom

,

ClearBorderLeft

,

ClearBorderRight ...F

Not attached to any event
Clears one border in actual or focused cell.
new 12.0 <Actions>

SetBorder ...F

Not attached to any event
Sets all four borders in actual or focused cell to BorderOut.
new 12.0 <Actions>

SetBorderTop

,

SetBorderBottom

,

SetBorderLeft

,

SetBorderRight ...F

Not attached to any event
Sets one border in actual or focused cell to BorderOut.
new 12.0 <Actions>

SetBorderIn ...F

Not attached to any event
Sets all four borders in actual or focused cell to BorderIn.
new 12.0 <Actions>

SetBorderInTop

,

SetBorderInBottom

,

SetBorderInLeft

,

SetBorderInRight ...F

Not attached to any event
Sets one border in actual or focused cell to BorderIn.
new 12.0 <Actions>

ClearBorders ...F

Not attached to any event
Clears all four borders in all focused cells. Version without ...F fails if the actual cell is not focused.
new 12.0 <Actions>

ClearBordersOut ...F

Not attached to any event
Clears all outer borders in the focused range. Version without ...F fails if the actual cell is not focused.
Outer border is between focused and not focused cell.
new 12.0 <Actions>

ClearBordersIn ...F

Not attached to any event
Clears all inner borders in the focused range. Version without ...F fails if the actual cell is not focused.
Inner border is between two focused cells.
new 12.0 <Actions>

ClearBordersTop

,

ClearBordersBottom

,

ClearBordersLeft

,

ClearBordersRight ...F

Not attached to any event
Clears one border in the focused range. Version without ...F fails if the actual cell is not focused.
new 12.0 <Actions>

SetBorders ...F

Attached to OnClickButtonBorder event
Sets outer and inner borders in the focused range. Version without ...F fails if the actual cell is not focused.
Outer border is set to BorderOut, inner border to BorderIn.
Outer border is between focused and not focused cell. Inner border is between two focused cells.
new 12.0 <Actions>

SetBordersOut ...F

Not attached to any event
Sets outer borders in the focused range. Version without ...F fails if the actual cell is not focused.
The border is set to BorderOut. Outer border is between focused and not focused cell.
new 12.0 <Actions>

SetBordersOutTop

,

SetBordersOutBottom

,

SetBordersOutLeft

,

SetBordersOutRight ...F

Not attached to any event
Sets one outer border in the focused range to BorderOut. Version without ...F fails if the actual cell is not focused.
new 12.0 <Actions>

SetBordersIn ...F

Not attached to any event
Sets inner borders in the focused range. Version without ...F fails if the actual cell is not focused.
The border is set to BorderIn. Inner border is between two focused cells.
new 12.0 <Actions>

SetBordersInTop

,

SetBordersInBottom

,

SetBordersInLeft

,

SetBordersInRight ...F

Not attached to any event
Sets one inner border in the focused range to BorderIn. Version without ...F fails if the actual cell is not focused.
new 12.0 <Actions>

ClearSelectedBorders ...F

Not attached to any event
Clears all four borders in all selected cells. Version without ...F fails if the actual cell is not selected.
new 12.0 <Actions>

ClearSelectedBordersOut ...F

Not attached to any event
Clears all outer borders in all selected ranges. Version without ...F fails if the actual cell is not selected.
Outer border is between focused and not focused cell.
new 12.0 <Actions>

ClearSelectedBordersIn ...F

Not attached to any event
Clears all inner borders in all selected ranges. Version without ...F fails if the actual cell is not selected.
Inner border is between two focused cells.
new 12.0 <Actions>

ClearSelectedBordersTop

,

ClearSelectedBordersBottom

,

ClearSelectedBordersLeft

,

ClearSelectedBordersRight ...F

Not attached to any event
Clears one border in all selected ranges. Version without ...F fails if the actual cell is not selected.
new 12.0 <Actions>

SetSelectedBorders ...F

Attached to OnClickButtonBorder event
Sets outer and inner borders in all selected ranges. Version without ...F fails if the actual cell is not selected.
Outer border is set to BorderOut, inner border to BorderIn.
Outer border is between focused and not focused cell. Inner border is between two focused cells.
new 12.0 <Actions>

SetSelectedBordersOut ...F

Not attached to any event
Sets outer borders in all selected ranges. Version without ...F fails if the actual cell is not selected.
The border is set to BorderOut. Outer border is between focused and not focused cell.
new 12.0 <Actions>

SetSelectedBordersOutTop

,

SetSelectedBordersOutBottom

,

SetSelectedBordersOutLeft

,

SetSelectedBordersOutRight ...F

Not attached to any event
Sets one outer border in all selected ranges to BorderOut. Version without ...F fails if the actual cell is not selected.
new 12.0 <Actions>

SetSelectedBordersIn ...F

Not attached to any event
Sets inner borders in all selected ranges. Version without ...F fails if the actual cell is not selected.
The border is set to BorderIn. Inner border is between two focused cells.
new 12.0 <Actions>

SetSelectedBordersInTop

,

SetSelectedBordersInBottom

,

SetSelectedBordersInLeft

,

SetSelectedBordersInRight ...F

Not attached to any event
Sets one inner border in all selected ranges to BorderIn. Version without ...F fails if the actual cell is not selected.
new 12.0 <Actions>

ChooseBorderStyle

,

ChooseBordersStyle

,

ChooseSelectedBordersStyle ...F

Not attached to any event
Shows menu with 9 items as available border styles. If used in Menu, shows submenu with the 9 border styles.
And sets the chosen style to Border... in actual or focused cell or in all focused cells or in all selected cells.
The result is affected also by edge and color set in BorderIn and BorderOut.
new 12.0 <Actions>

ChooseBorderEdge

,

ChooseBordersEdge

,

ChooseSelectedBordersEdge ...F

Not attached to any event
Shows menu with 11 items as possible border edges. If used in Menu, shows submenu with the 11 border edges.
And sets the chosen edge in Border... in actual or focused cell or in all focused cells or in all selected cells.
The result is affected also by style and color set in BorderIn and BorderOut.
new 12.0 <Actions>

ChooseBorderColor

,

ChooseBordersColor

,

ChooseSelectedBordersColor ...F

Not attached to any event
Shows menu with colors predefined in BorderColors. If used in Menu, shows submenu with the border colors.
And sets the chosen color to Border... in actual or focused cell or in all focused cells or in all selected cells.
The result is affected also by edge and style set in BorderIn and BorderOut.
new 12.0 <Actions>

ChooseBorder

,

ChooseBorders

,

ChooseSelectedBorders ...F

Attached to Toolbar button Border OnClickPopup event
Shows menu with 3 columns, in left column are 9 items as available border styles, in middle column are 11 items are possible border edges and in right column are colors defined by BorderColors. If used in Menu, shows submenu with the 9 border styles, 11 border edges and border colors.
And sets the chosen style to Border... in actual or focused cell or in all focused cells or in all selected cells.

Cell HTML style

<C><I><cell> string

HtmlPrefix

Html code displayed inside cell in front of the value.
Use the HtmlPrefix and HtmlPostfix to add any text or formatting HTML tags before and after cell value.
For formatting use rather Class or Color attribute, it is remarkably faster.
Be careful while including HTML code to cell, any invalid HTML code can break down the grid layout.
It is read from row before column.
<C><I><cell> string

HtmlPostfix

Html code displayed inside cell after the value. See HtmlPrefix.
<Header> bool

NoEscape

[0]
Set it to 1 to use HTML code in column captions - Header cells. It uses Html Type cells for Header instead of default Lines.

Row color alteration

renamed 6.0 <Cfg> int

Alternate

Highlight odd or every N row by another color or class.
0 - no row, 1 - every row, 2 - every odd row, every third row, 3 - every fourth row, ...
By default it uses the Alternate color defined in the actual style in Grid.css.
new 11.0 <Cfg> int

AlternateCount

[1]
Count of colored rows in one group.
For example if set Alternate='5' AlternateCount='2' it will color: 3 normal, 2 alternate, 3 normal, 2 alternate, ...
new 12.1 <Cfg> int

AlternateStart

[...]
First row that will be marked with alternate color. 0 means the first row.
By default it is Alternate - AlternateCount.
new 11.0 <Cfg> int

AlternateType

[0]
Alternate coloring flags, bit array.
1. bit (&1)If the expanded children coloring will be included in parent coloring. It will slow down expanding / collapsing, because it will always recolor the whole grid.
2. bit (&2)If the root pages in server paging will be included in the other pages coloring. It will slow down loading pages, because it will always recolor the whole grid.
new 6.0 <I> string

AlternateColor

Alternate (absolute) color to be used instead of default alternate color, if the row is odd or Nth.
It can be set as "240,240,240" or "rgb(240,240,240)" or "#F0F0F0" or "#FFF".
Remember it is overridden by Background, but not by Color.
new 6.0 <I> string

AlternateClass

Alternate CSS class name(s) to be used instead of default alternate class, if the row is odd or Nth.
new 7.0 API method void

ReColor

( )
Recolors the whole grid. Call it after change in Alternate settings.

Cell mouse cursor

new 6.0 <C> <cell> string

Cursor

Mouse cursor displayed when mouse hovering the cell.
It can be standard CSS cursor name: auto, crosshair, default, pointer, move, e-resize, ne-resize, nw-resize, n-resize, se-resize, sw-resize, s-resize, w-resize, text, wait, help.
It is ignored if cell content contains some CSS cursor setting.
new 6.0 <C> <cell> string

XXXCursor

Mouse cursor displayed when mouse hovering given cell event target. The XXX is actual cell event target under mouse cursor. If such cursor does not exist, the normal Cursor is displayed.
The XXX can be any event target name, see Actions and events, for example EditInt, ButtonSave, SideDefaults, Side, Content and so on.
It is intended to show different cursor for part of the cell like side or tree button.
new 6.0 <Actions>

CursorDefault

Attached to many events, can be attached only to OnMouseOver and OnDragOver events
Sets "default" cursor.
By default it is attached to OnMouseOverPanelOff, OnMouseOverHeaderOff, OnMouseOverSpaceOff, OnMouseOverTree, OnMouseOverNoFocus, OnMouseOverReadOnly, OnMouseOverNothing.
new 6.0 <Actions>

CursorPointer

Attached to many events, can be attached only to OnMouseOver and OnDragOver events
Sets "pointer" / "hand" cursor.
By default it is attached to OnMouseOverButton, OnMouseOverPanel, OnMouseOverSide, OnMouseOverEditBool, OnMouseOverEditEnum, OnMouseOverEditRadio, OnMouseOverSort, OnMouseOverSortUp, OnMouseOverSortDown, OnMouseOverExpand.
new 6.0 <Actions>

CursorText

Attached to OnMouseOverEditable, can be attached only to OnMouseOver and OnDragOver events
Sets "text" cursor.
new 6.0 <Actions>

CursorResize

Attached to many events, can be attached only to OnMouseOver and OnDragOver events
Sets "e-resize" cursor.
By default it is attached to OnMouseOverHeaderLeft, OnMouseOverHeaderRight, OnMouseOverPagerHeaderRight.
new 6.0 <Actions>

CursorResizeGrid

Attached to OnMouseOverResize, can be attached only to OnMouseOver and OnDragOver events
Sets "nw-resize" cursor.
new 6.0 <Actions>

CursorMove

Attached to OnMouseOverPanelMove, can be attached only to OnMouseOver and OnDragOver events
Sets "move" cursor.
new 6.0 <Actions>

CursorDrag

Attached to OnDragOverCell, can be attached only to OnMouseOver and OnDragOver events
Sets "Drag.cur" cursor when there is no dragging active.
Otherwise sets a cursor according to dragging action.