List of Events
Events are signals that let you execute specific actions—such as manipulating the DOM, sending data to the server, and so on—using JavaScript, in response to any interactions/updates for your grid. The FusionGrid API offers a wide range of events that you can use to trigger actions for different stages in the life cycle of your grid or when you interact with a grid.
All the concerned events are listed down below categorized with respect to their action type, component and lifecycle state.
LifeCycle Events
| Event Name | Description |
|---|---|
beforeRender |
Grid is configured properly and starting to render. Data parameter: type: ‘beforeRender’ |
dispose |
Grid is disposed. Data parameter: type: ‘disposed’ |
initialized |
Grid initialized by calling the grid constructor but the grid is not yet rendered. Data parameter: type: ‘initialized’ |
rendered |
Grid rendered. Data parameter: type: ‘rendered’ |
resized |
Grid is resized as it’s parent container is resized. Data parameter: type: ‘resized’ width: width of the grid height: height of the grid |
updated |
Grid configuration or data is updated. Data parameter: type: ‘update’ config: Updated grid configuration. |
Action Events
Some action events happen upon interacting with data in the form of clicking, selecting or hovering, let's see the events for each action.
Clicking Events
This are the clicking events:
| Event Name | Description |
|---|---|
rowClicked |
A row is clicked. |
rowDoubleClicked |
Double clicked performed on a row. |
headerClicked |
Triggers when a header is clicked. |
Hovering Events
This are the hovering events:
| Event Name | Description |
|---|---|
rowHovered |
A row is hovered. |
columnHovered |
A column is hovered. |
Selection Events
This are the selection events:
| Event Name | Description |
|---|---|
rowSelected |
A row is selected. |
rowDeselected |
A row is deselected. |
allRowsSelected |
All rows are selected. |
allRowsDeselected |
All rows are deselected. |
Component Events
Here we list the different types of component events.
Card Layout Events
| Event Name | Description |
|---|---|
cardClicked |
When a card is clicked. |
cardDoubleClicked |
Triggers when a double click occurs on a card. |
cardLongPressed |
Triggers when a card is long pressed. |
Column Menu Events
| Event Name | Description |
|---|---|
columnMenuClicked |
Column menu is clicked. |
columnMenuOpen |
Column menu open is triggered by clicking on the menu. |
columnMenuClosed |
Column menu is closed either by clicking on the menu icon or using any button inside the menu. |
Filter Events
| Event Name | Description |
|---|---|
filterApplied |
A filter is applied. |
filterModified |
Some filter is changed but apply button is not yet clicked. |
Layout Events
| Event Name | Description |
|---|---|
layoutChanged |
Triggers when any change occurs in layout - from row to card or vice versa, layout density change, layout fit logic change. |
layoutTypeChanged |
Triggers when layout type is changed from row to card or vice versa. |
| Event Argument | Description |
|---|---|
layout |
Applied layout object. |
layoutType |
Current layout type. |
prevLayoutType |
Previous layout type. |
viewport |
Applied viewport object. |
Pagination Events
| Event Name | Description |
|---|---|
pageChanged |
Triggers when user navigate to a new page using pagination panel or API. |
pageSizeChanged |
Page size is changed through pagination panel or API. |
Scroll Events
| Event Name | Description |
|---|---|
scroll |
Triggers when scrolling occurs in grid either horizontally or vertically. |
| Event Argument | Description |
|---|---|
direction |
‘horizontal’/’vertical’. |
left |
left px of the scroll. |
top |
top px of the scroll. |
Sort Events
| Event Name | Description |
|---|---|
sortChanged |
A sort has applied or existing sort changed. |
United Common Events for Row and Card
| Event Name | Description |
|---|---|
recordClicked |
When a card or row is clicked. |
recordDoubleClicked |
Triggers when a double click occurs on card or record. |