Hi,
I programmatically change the selected row by using the selectedRows attribute.
I would like then to vertically scrolls the grid until the provided row index is inside the visible viewport.
It seams that the callback that I am looking for is called
ensureIndexVisible( index: number, position: string)
JavaScript Data Grid: Grid API (ag-grid.com)
but i do not see the reference.
Can you please help me?
Thank you!
Hello @davidpsq ,
This currently isn’t supported.
However, I am going to make a feature request to expose the api and columnApi for things like this.
1 Like
Here, you can track this feature request:
opened 04:30PM - 22 May 23 UTC
Good day,
I'd like to request a feature to allow for JS to be used seamlessl… y with the grid's `api` and `columnApi`, this would allow for clientside callback's to work arbitrarily and alter things about the grid's state without need to create specific endpoints in the grid's componet.
The reasoning:
There are tons of features built in to the [api](https://www.ag-grid.com/react-data-grid/grid-api/) and the [columnApi](https://www.ag-grid.com/react-data-grid/column-api/) that to include them all would bloat the component. Exposing these would allow for developers to customize their workflow in an indefinite number of ways.
Some current examples of things that would be available:
[scroll to row/column](https://community.plotly.com/t/ag-grid-vertically-scrolls-the-grid/75457/2)
[drag between grids](https://community.plotly.com/t/dash-ag-grid-how-to-drag-drop-between-grids/75214/8) - would more align with the AG Grid [example](https://www.ag-grid.com/react-data-grid/drag-and-drop/#dragging-between-grids)
[adjusting row height](https://www.ag-grid.com/react-data-grid/row-height/#apiresetrowheights)
More complex workflows for components and editors to interact with other things about the grid.
Complications:
With great power comes great responsibility. There is the chance that updates to the grid may not make their way into the `columnState` in Dash, `rowData` or other changes may also get out of sync.
Possible JS workflow:
```
app.clientside_callback(
""" function (i) {
var gridState = document.getElementById("#grid").gridState()
return window.dash_clientside.no_update
}""",
Output('grid','id'), Input('grid','id'))
app.clientside_callback("""
function resetHeight(n) {
if (n) {
gridState.api.resetRowHeights()
}
return window.dash_clientside.no_update
}""",
Output('resetHeight','n_clicks'), Input('resetHeight','n_clicks')
```
You can also see the current feature request for the issue closely related to this topic:
opened 04:02PM - 08 May 23 UTC
Scrolling to a row is a frequently requested feature for DataTable. It looks li… ke it available in AG Grid: https://www.ag-grid.com/javascript-data-grid/grid-api/#reference-scrolling