Skip to main content

TreeGrid API overview

TreeGrid methods#

NameDescription
addCellCss()adds a style to a cell
addRowCss()adds a style to a row
addSpan()adds a rows/cols span
adjustColumnWidth()adjusts the width of a column to make all its content visible
collapse()collapses a tree node by id
collapseAll()collapses all expanded Tree nodes
destructor()removes a Grid instance and releases occupied resources
editCell()enables editing of a TreeGrid cell
editEnd()finishes editing in a cell
expand()expands a tree node by id
expandAll()expands all collapsed tree nodes
getCellRect()returns the parameters of a cell
getColumn()returns an object with attributes of a column
getHeaderFilter()returns an object of the header filter by column id
getScrollState()returns the coordinates of a position a grid has been scrolled to
getSortingState()returns the current state of sorting data in TreeGrid
getSpan()returns an object with spans
groupBy()groups grid content either by values of the specified column or by the result of calculation
hideColumn()hides a column of Grid
hideRow()hides a row of TreeGrid
isColumnHidden()checks whether a column is hidden
isRowHidden()checks whether a row is hidden
paint()repaints a grid on a page
removeCellCss()removes a style from a cell
removeRowCss()removes a style from a row
removeSpan()removes a cols/rows span
scroll()scrolls a grid according to specified coordinates
scrollTo()scrolls a grid to a specified cell
setColumns()sets configuration for TreeGrid columns
showColumn()makes a specified column visible on a page
showRow()makes a specified row visible on a page
ungroup()ungroups the grid to return it into the plain view
important

TreeGrid events#

Collapse and Expand#

NameDescription
afterCollapsefires after collapsing a treegrid
afterExpandfires after expanding a treegrid
beforeCollapsefires before collapsing a treegrid
beforeExpandfires before expanding a treegrid
expandfires on expanding a treegrid

Editing#

NameDescription
afterEditEndfires after editing of a cell is ended
afterEditStartfires after editing of a cell has started
beforeEditEndfires before editing of a cell is ended
beforeEditStartfires before editing of a cell has started

Mouse#

NameDescription
cellClickfires on click on a grid cell
cellDblClickfires on double-click on a grid cell
cellMouseDownfires before releasing the left mouse button when clicking on a grid cell
cellMouseOverfires on moving the mouse pointer over a grid cell
cellRightClickfires on right click on a grid cell
footerCellClickfires on click on a grid footer cell
footerCellDblClickfires on double-click on a grid footer cell
footerCellMouseDownfires on moving the mouse pointer over a grid footer cell
footerCellMouseOverfires on moving the mouse pointer over a grid footer cell
footerCellRightClickfires on right click on a grid footer cell
headerCellClickfires on click on a grid header cell
headerCellDblClickfires on double-click on a grid footer cell
headerCellMouseDownfires on moving the mouse pointer over a grid header cell
headerCellMouseOverfires on moving the mouse pointer over a grid header cell
headerCellRightClickfires on right click on a grid header cell

Scroll#

NameDescription
scrollfires on scrolling a grid

Sort and Filter#

NameDescription
afterSortfires after a column is sorted by clicking on its header
beforeSortfires before a column is sorted by clicking on its header
filterChangefires on typing text in an input of a column's header

Column Drag and Drop#

NameDescription
afterColumnDragfires after dragging of a column is finished
afterColumnDropfires before the user has finished dragging a column but after the mouse button is released
beforeColumnDragfires before dragging of a column has started
beforeColumnDropfires before the user has finished dragging and released the mouse button over a target column
cancelColumnDropfires on moving a mouse pointer out of borders of a column while dragging the column
canColumnDropfires when a dragged column is placed over a target column
dragColumnInfires when a column is dragged to another potential target
dragColumnOutfires when a column is dragged out of a potential target
dragColumnStartfires when dragging of a column has started

Column Hide and Show#

NameDescription
afterColumnHidefires after a column is hidden
afterColumnShowfires after a column is shown
beforeColumnHidefires before a column is hidden
beforeColumnShowfires before a column is shown on a page

Column Resize#

NameDescription
afterResizeEndfires after resizing of a column is ended
beforeResizeStartfires before resizing of a column has started
resizefires on resizing a column

Row Drag and Drop#

NameDescription
afterRowDragfires after dragging of a row is finished
afterRowDropfires before the user has finished dragging a row but after the mouse button is released
beforeRowDragfires before dragging of a row has started
beforeRowDropfires before the user has finished dragging and released the mouse button over a target row
cancelRowDropfires on moving a mouse pointer out of borders of a row while dragging the row
canRowDropfires when a dragged row is placed over a target row
dragRowInfires when a row is dragged to another potential target
dragRowOutfires when a row is dragged out of a potential target
dragRowStartfires when dragging of a row has started

Row Hide and Show#

NameDescription
afterRowHidefires after a row is hidden
afterRowShowfires after a row is shown on a page
beforeRowHidefires before a row is hidden
beforeRowShowfires before a row is shown on a page

Row Resize#

NameDescription
afterRowResizefires after the height of a row is changed
beforeRowResizefires before the height of a row is changed
important

TreeGrid properties#

NameDescription
adjustdefines whether the width of columns is automatically adjusted to the width of their content
autoEmptyRowadds an empty row after the last filled row in the TreeGrid
autoHeightmakes long text to split into multiple lines based on the width of the column
autoWidthmakes treegrid's columns to fit the size of a treegrid
columnsspecifies the configuration of grid columns
cssadds style classes to TreeGrid
dataspecifies an array of data objects to set into the grid
dragCopydefines that a row is copied to a target during drag-n-drop
dragItemenables the possibility to reorder treegrid columns by drag and drop
dragModeenables drag-n-drop in Treegrid
editableenables editing in TreeGrid columns
eventHandlersadds event handlers to HTML elements of a custom template of a TreeGrid cell or to the HTML elements defined in the data set of TreeGrid
footerRowHeightsets the height of rows in the footer
groupTitleTemplatesets a template to the title of a group
headerRowHeightsets the height of rows in the header
heightsets the height of a grid
htmlEnablespecifies the HTML content (inner HTML) of TreeGrid columns
leftSplitsets the number of frozen columns
resizabledefines whether columns can be resized
rootParentdefines the id of the root parent
rowCsssets style for a row
rowHeightdefines the height of a row in a grid
selectionenables selection in a grid
sortabledefines whether sorting on clicking headers of columns is enabled
spansdescribes the configuration of cols/rows spans
tooltipenables a tooltip on hovering over the content of a column
widthsets the width of a grid

Column properties#

You will find the list of all the available configuration properties of a TreeGrid column here.

Selection API#

Selection methods#

NameDescription
disable()disables selection of cells in Grid
enable()enables selection of cells in Grid
getCell()returns the object of a selected cell
removeCell()unselects previously selected cells
setCell()sets selection to a specified cell

Selection events#

NameDescription
afterSelectfires after selecting a cell
afterUnSelectfires after unselecting a cell
beforeSelectfires before selecting a cell
beforeUnSelectfires before unselecting a cell