'AG Grid, Capture the event on click of chevron
Ag-grid provides onCellClicked event for when a cell is clicked. But I noticed that it doesn't trigger when we click the chevron. I need to capture this event for analytics as a user might click the chevron directly rather than the cell itself. Any idea how to achieve this or what event to use here? I am using detailRenderer to render child rows, if that helps. Here is one of the columnDefs item:
{
headerName: "Line Item",
field: "displayLineNumber",
width: "100px",
sortable: false,
expandable: true,
onCellClicked: (event) => {
event.node.setExpanded(!event.node.expanded);
if (event.node.expanded === true) {
DataLayerUtils.pushEvent(
"click",
{
name: "Open Line Item",
type: "button",
},
{
click: {
category: "Quote Detail Table Interactions",
},
}
);
} else {
DataLayerUtils.pushEvent(
"click",
{
name: "Collapse Line Item",
type: "button",
},
{
click: {
category: "Quote Detail Table Interactions",
},
}
);
}
},
rowClass: ({ node, data }) => {
return `cmp-product-lines-grid__row ${
!data?.children || data.children.length === 0
? "cmp-product-lines-grid__row--notExpandable"
: ""
}`;
},
detailRenderer: ({ data }) => (
<section className="cmp-product-lines-grid__row cmp-product-lines-grid__row--expanded">
<ProductLinesChildGrid
gridProps={gridProps}
license={gridProps.agGridLicenseKey}
columnDefiniton={
whiteLabelMode ? whiteLabelCols() : quoteDetailsCols()
}
data={data.children}
onModelUpdateFinished={() => {
markupChanged(mutableGridData);
}}
/>
</section>
),
},
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|

