Adaptable Events

AdapTable fires a number of Events, which provide information about everything that is happening inside AdapTable and the underlying vendor grid.

Subscribing to Events

Users are able to subscribe to these Events, and to respond as appropriate, via the on method in the Event section of the Adaptable API.

This takes 2 parameters:

  • eventName - name of event being subscribed to
  • callback - object containing relevant information, of type [EventName]Info

For example the definition of the LayoutChangedEvent is:

eventName: 'LayoutChanged',
callback: (eventInfo: LayoutChangedInfo) => void
): () => void;

And to subscribe to the event you could do:

api.eventApi.on('LayoutChanged', (eventInfo: LayoutChangedInfo) => {
// do something with the info

Unsubscribing from Events

There is a parallel unsubsciption off method in the Event API.

This takes the same form as the on method, so unsubscribing from the LayoutChangedEvent is simply:

eventName: 'LayoutChanged',
callback: (eventInfo: LayoutChangedInfo) => void
): () => void;

Adaptable Ready Event

This is an important Adaptable Event that is fired by AdapTable after it has completed initialisation.


This is a good place to safely make any required changes to AdapTable State or Predefined Config as it will now have been fully loaded


If using the React or Angular Wrappers, this event is the recommended way to get hold of the Adaptable API


The AdaptableReadyInfo class which the event provides contains is defined as follows:

vendorGridInstance of the underlying vendor grid (e.g. for AG Grid its the GridOptions object)

As can be seen the object contains 2 very important properties:

  • adaptableApi: The Adaptable API providing run time access to all methods, functionality and events in AdapTable (and is available in all AdapTable Events)

  • vendorGrid: The instance of whichever underlying vendor grid being used


    The vendorGrid property returned here should be used when accessing the underlying DataGrid


    This is particularly the case for 'core' (i.e. vanilla) AdapTable users as the vendorGrid object that is provided in Adaptable Options is updated by the AdapTable constructor

Event Subscription

Subscribing to the Event is done the same as with all Adaptable Events:

api.eventApi.on('AdaptableReady', (eventInfo: AdaptableReadyInfo) => {
// do something with the info

Other AdapTable Events

The other Events which are fired by AdapTable are:

EventWhen Fired
AdaptableStateChangedSomething has changed in Adaptable State
AlertFiredAn alert is triggered in Adaptable
CellChangedUser makes an edit in a Grid Cell or a ticking data change is made
CheckboxColumnClickedA Checkbox has been clicked (boolean column)
CustomToolbarConfiguredThe 'configure' button is clicked in a Custom Toolbar
DashboardChangedDashboard State changed (useful for rendering Custom toolbars)
FlashingAlertFiredA Flashing Alert was fired
GridDataChangedRows have been added, updated or deleted in the Grid
LayoutChangedThe Layout section of Adaptable State changes
LiveDataChangedSomething happens related to the 'live reports' that AdapTable offers
SearchChangedState has changed in a Search-related Module (e.g. Query, Filters etc)
SelectionChangedCells or Rows have been selected in the Grid
SystemStatusMessageDisplayedA new System Status Message has been displayed
TeamSharingEntityChangedAn Active Shared Entity in Team Sharing has changed
ThemeChangedThe Theme in Adaptable has changed


The following demos show aspects of Adaptable Events