I have a two grid columns set up to display as editable drop-down fields. The column definition for each field uses this code to render the selection values:
return '<div class="editCell-innerDiv">' + params.value +
'<img class="alignRight" src="/resource/images/triangle-down_filled_12.png" alt="">' +
'</div>';
and render like this in the grid:
When the user changes a value in one drop-down, I need to clear the value in the other drop-down. When I use this JS code:
params.node.setDataValue('Some_Field', '');
I get this error in the console:
Cannot read properties of null (reading 'getColDef')
What code would I use to programmatically clear the other editable select field in the grid?
The way I do this, although I am not sure if the context is exactly the same (I do it within an event handler for Tab keys), is as follows...
params.node.data.Some_Field = '';
api.refreshCells({ rowNodes: [params.node], force: true });
I am not sure how you will get access to the ag-grid api (the api object in my code sample). This will depend on the context of your code.