Javascript - Is there a way to capture the row checkbox change event on AG Grid React?

Javascript – Is there a way to capture the row checkbox change event on AG Grid React?

Last updated: 2023/12/20 at 3:58 PM

Admin

1 Min Read

Problem:

I’m currently using AG Grid for React in one of my applications. All my rows have checkboxes to indicate further inspection. I want to capture when the checkbox checked state changes. I can use onRowSelected event for this but with one caveat, this event fires for both unselected rows and checkboxes. I need something to differentiate between an actual checkbox value/event and a row selection.

Contents

Problem:Solution:

I need an event or an atribute/function that only fires/specifies when checkbox is checked/unchecked.

Is this available on Ag-grid React?

Solution:

Okay you want to capture only if the row is selected by a checkbox event.

Well if you dig through the event parameter of the grid events, you can get lots of details. I like this feature of Ag-Grid.

onRowSelected has a parameter called source. We can use it for this purpose.

const onRowSelected = useCallback((event) => {
  console.log('onRowSelected event', event);

  if (event.source === 'checkboxSelected')
    window.alert(
      'Node is ' +
        (event.node.isSelected() ? 'selected' : 'deselected') +
        ' by checkbox'
    );
}, []);