Get ag-grid instance by container div Id

Question

I know that in order to generate a new ag-Grid we can do the following:

    new agGrid.Grid(gridDiv, gridOptions);

Where gridDiv is the "container div" of the ag-grid and gridOptions , the options of the grid.

Is it possible to fetch the grid instance given that I have its "container div" Id? I basically want to access its gridOptions / gridOptions.api

Answer 1

This answer assumes you have access to the code.

You can get access to the API if you have control of the gridOptions. Once the grid is intialized, which means after this line is executed

new agGrid.Grid(eGridDiv, gridOptions);

It passes gridApi and columnApi to your gridOptions. You can begin to manipulate the table whatever you want. Here is a small example

// at this point you don't have accesss to the API yet
var gridOptions = {
  columnDefs: columnDefs,
  rowData: rowData,
};

var eGridDiv = document.querySelector('#myGrid');

// initialize ag-grid
new agGrid.Grid(eGridDiv, gridOptions);

// grid APIs are ready, we can print current column state for example
console.log(gridOptions.columnApi.getColumnState());

setTimeout(() => {
  var sort = [
    { colId: 'price', sort: 'desc' },
  ];
  gridOptions.api.setSortModel(sort);
}, 2000)

See the live demo here

Reference

• https://www.ag-grid.com/javascript-grid