AG Grid: Unmanaged Row Dragging - can't get onRowDragEnter to log to console

Hello, I’m trying to implement unmanaged row dragging and started by trying to get the onRowDrag… function to log something console.

I adapted from:

I’ve tried variations of

"onRowDragEnter"
"onRowDragEnter(event)"
"onRowDragEnter(params)"
{"function": "log('hi')"}
{"function": "log(event)"}
{"function": "log(params)"}
{"function": "onRowDragEnter"}
{"function": "onRowDragEnter(event)"}
{"function": "onRowDragEnter(param"}

But could not get any back. What am I missing? I’ve also tried putting functions in dagAgGridComponentFunctions

Does anyone have a working example I can reproduce?

On the other hand, the follow works just fine

"rowDragText": {"function": "log(params)"}

Source code:

import dash_ag_grid as dag
from dash import Dash, html

app = Dash(__name__)

rowData = [{'name': 'one'}, {'name': 'two'}, {'name': 'three'}]

columnDefs = [{'field': 'name', 'rowDrag': True}]

app.layout = html.Div(
    [
        dag.AgGrid(
            id='row-dragging-unmanaged',
            rowData=rowData,
            columnDefs=columnDefs,
            dashGridOptions={
                "rowDragManaged": False,
                "onRowDragEnter": {"function": "onRowDragEnter"}
            }
        ),
    ],
)

if __name__ == "__main__":
    app.run(host="0.0.0.0", debug=True)

# dagAgGridFunctions.js
#---------------------------------------------------------------------------------------------
# var dagfuncs = window.dashAgGridFunctions = window.dashAgGridFunctions || {};
# dagfuncs.onRowDragEnter = (e) => {console.log(e)}

Hello @duonkha,

Welcome to the community!

The grid does not have a property called onRowDragEnter, nor does it have a property for rowDragEnter, this is an event.

To register listening to an event, you’ll need to use the api by doing this in a clientside callback:

dash_ag_grid.getApiAsync(id).then((grid) => grid.addEventListener('rowDragEnter', (e) => console.log(e)))

You can check out some examples of row dragging here:

1 Like

Thank you @jinnyzor, I can work with this.

1 Like