React Data GridRow Object (aka Row Node)
A Row Node represents one row of data.
The Row Node will contain a reference to the data item your application provided as well as other runtime information about the row. The Row Node contains attributes, methods and emits events. Additional attributes are used if the Row Node is a group.
If using Typescript, Row Nodes' support a generic data type via IRowNode<TData>
. If not set TData
defaults to any
. See Typescript Generics for more details.
All Row Node Attributes
idTypestring | undefined | Unique ID for the node. Either provided by the application, or generated by the grid if not. |
dataTypeTData | undefined | The data as provided by the application. Can be undefined when using row grouping or during grid initialisation.
|
displayedTypeboolean | This will be true if it has a rowIndex assigned, otherwise false .
|
row | Either 'top' or 'bottom' if row pinned, otherwise undefined or null . |
selectableTypeboolean | Is this row selectable. |
masterTypeboolean | true if this row is a master row, part of master / detail (ie row can be expanded to show detail). |
detailTypeboolean | true if this row is a detail row, part of master / detail (ie child row of an expanded master row). |
row | The height, in pixels, of this row. |
row | The row top position in pixels. |
groupTypeboolean | undefined | true if this node is a group node (i.e. it has children) |
parentTypeIRowNode | null | The parent node to this node, or empty if top level. |
first | true if this is the first child in this group. Changes when data is sorted. |
last | true if this is the last child in this group. Changes when data is sorted. |
child | Index of this row with respect to its parent when grouping. Changes when data is sorted. |
levelTypenumber | How many levels this node is from the top when grouping. |
ui | How many levels this node is from the top when grouping in the UI (only different to parent when groupRemoveSingleChildren=true ). |
row | The current row index. If the row is filtered out or in a collapsed group, this value will be null . |
stubTypeboolean | Used by server-side row model. true if this row node is a stub. A stub is a placeholder row with loading icon while waiting from row to be loaded. |
failed | Used by server side row model, true if this row node failed a load. |
quick | If using quick filter, stores a string representation of the row for searching against. |
Group Node Attributes
group | If using row grouping, contains the group values for this group. |
agg | If using row grouping and aggregation, contains the aggregation data. |
keyTypestring | null | The key value for this group. |
fieldTypestring | null | The field we are grouping on from our row data. |
row | The row group column used for this group. |
row | If doing in-memory (client-side) grouping, this is the index of the group column this cell is for. This will always be the same as the level, unless we are collapsing groups, i.e. groupRemoveSingleChildren=true .
|
expandedTypeboolean | true if group is expanded, otherwise false . |
footerTypeboolean | true if row is a footer. Footers have group = true and footer = true . |
all | All lowest level nodes beneath this node, no groups. |
children | Children of this group. If multi levels of grouping, shows only immediate children. |
children | Filtered children of this group. |
children | Sorted children of this group. |
all | Number of children and grand children. |
leaf | true if this node is a group and the group is the bottom level in the tree. |
siblingTypeIRowNode | If using footers, reference to the footer node for this group. |
Row Node Methods
Row Node Events
All events fired by the rowNode
are synchronous (events are normally asynchronous). The grid is also listening for these events internally. This means that when you receive an event, the grid may still have some work to do (e.g. if rowTop
changed, the grid UI may still have to update to reflect this change). It is also best you do not call any grid API functions while receiving events from the rowNode
(as the grid is still processing). Instead, it is best to put your logic into a timeout and call the grid in another VM tick.
When adding event listeners to a row, they will stay with the row until the row is destroyed. This means if the row is taken out of memory (pagination or virtual paging) then the listener will be removed. Likewise, if you set new data into the grid, all listeners on the old data will be removed.
Be careful when adding listeners to rowNodes
in cell renderers that you remove the listener when the rendered row is destroyed due to row virtualisation. You can cater for this as follows:
init(params: ICellRendererParams) {
// add listener
var selectionChangedCallback = () => {
// some logic on selection changed here
console.log('node selected = ' + params.node.isSelected());
};
params.node.addEventListener('rowSelected', selectionChangedCallback);
// remove listener on destroy
params.api.addRenderedRowListener('virtualRowRemoved', params.rowIndex, () => {
params.node.removeEventListener('rowSelected', selectionChangedCallback);
}
}
Events on Row Nodes
The following events can be listened to on rowNodes
: