Hi,
I try to execute a server callback from a context menu in ag grid.
In dashAgGridFunctions.js,
the content of a Div and an Input are updated using document.getElementById
a button is clicked with myButton.click().
On the screen the div and input are updated.
In app.py, the server callback is triggered but the innerText of the div or value of Input are not updates in the callback.
Any idea ?
Here is app.py
import dash_ag_grid as dag
from dash import Dash, html, Input, Output, no_update, State, dcc
app = Dash(name)
@app.callback(
Output(‘readDiv’,‘children’),
Output(‘readInput’,‘value’),
Input(‘button’, ‘n_clicks’),
State(‘div’, ‘children’),
State(‘input’, ‘value’),
)
def update_output_div(n, divChildren, inputValue):
if n == None:return no_update
if divChildren == ‘initial div’:
divChildrenOuput = ‘different of innerText just above’
else:
divChildrenOuput = divChildren
if inputValue == ‘initial input’:
inputValueOuput = ‘different of value just above’
else:
inputValueOuput = inputValue
print(divChildrenOuput)
print(inputValueOuput)
return divChildrenOuput, inputValueOuput
app.layout = html.Div(
[
html.Button(id=“button”, children=‘button trigger by client side’),
html.Br(),
html.Div(id=‘div’, children= ‘initial div’),
html.Br(),
html.Div(id=‘readDiv’, children= ‘initial div’),
html.Br(),
dcc.Input(id=‘input’, value=‘initial input’),
html.Br(),
dcc.Input(id=‘readInput’, value= ‘initial input’),
html.Br(),
dag.AgGrid(id=“myGrid”,
rowData = [{“column”: “cell”}],
columnDefs=[{“field”: ‘column’}],
dashGridOptions={
“allowContextMenuWithControlKey”: True,
“getContextMenuItems” :{“function”: “getContextMenuCallback(params)”}},
enableEnterpriseModules=True,
licenseKey = ‘’)
]
)
if name == “main”:
app.run(debug=True)
and dashAgGridFunctions.js
var dagfuncs = window.dashAgGridFunctions = window.dashAgGridFunctions || {};
dagfuncs.getContextMenuCallback = (params) => {
var result = [{
name: ‘right click’,
action: () => {
const result = document.getElementById("div");
result.innerText = 'Div updated by client side';
const inp = document.getElementById("input");
inp.value = 'Input updated by client side'
const myButton = document.getElementById("button");
myButton.click();
}
}
];
return result;
};
Before right click
After right clic
