PrimeReact Datatable cannot use onCellClick while having a checkbox column

Question

Hello I have an issue with PrimeReact were I cannot use onCellClick={() => console.log("clicked")} OR onCellSelect={() => console.log("select")} while having a checkbox column

<Column
          selectionMode="multiple"
          headerStyle={{ width: "3rem" }}
        ></Column>

I wanted to know if it is a known issue and if there is a workaround.

Here is a demo on codesandbox: https://codesandbox.io/s/primereact-demo-forked-6vyf5l?file=/src/App.js

Regards

I tried creating my own checkbox column. however I cant update the state of the checkbox. Since I can't pass a function/state updater.

<Column
          selectionMode="multiple"
          onClick= ...
          headerStyle={{ width: "3rem" }}
        ></Column>

score 0 · Answer 1 · answered Jul 27 '23 at 15:36

See my sandbox: https://codesandbox.io/s/primereact-demo-forked-9jjmhw?file=/src/App.js

CellSelection is NOT allowed in checkbox mode or radio mode but only on single select mode. It is due to this code in PrimeReact.

const allowCellSelection = () => {
    return props.cellSelection && !isRadioSelectionModeInColumn && !isCheckboxSelectionModeInColumn;
};

PrimeReact Datatable cannot use onCellClick while having a checkbox column

1 Answers1