T
TanStack•4y ago
other-emerald

Selecting checkbox not updating row selection state

I'm trying to add a select all option to my table like: https://codesandbox.io/s/github/tanstack/table/tree/main/examples/react/row-selection?from-embed=&file=/src/main.tsx But it looks like checking my checkboxes isn't updating the setRowSelection state as logging the rowSelection always returns an empty object. I've attached screenshots of the relevant code below. Do I need to manually call setRowSelection anywhere other than in the useReactTable?
CodeSandbox
tanstack-table-example-row-selection - CodeSandbox
tanstack-table-example-row-selection using @faker-js/faker, @tanstack/react-table, react, react-dom
No description
No description
No description
4 Replies
other-emerald
other-emeraldOP•4y ago
Just in case anyone comes across this. I had to use toggleSelected & toggleAllRowsSelected instead of the handlers
harsh-harlequin
harsh-harlequin•4y ago
The real answer to this is to not use an arrow function when calling the getHander functions, because they already return a function Should be onCheckedChange={row.getToggleSelectedHander()} or technically you could do something like 
onCheckedChange={() => {
  handleCheckboxClick();
  row.getToggleSelectedHandler()();
}}
onCheckedChange={() => {
  handleCheckboxClick();
  row.getToggleSelectedHandler()();
}}
other-emerald
other-emeraldOP•4y ago
@KevinVandy cheers! Just so i'm clear, is there something wrong with using the toggle functions instead of the getToggles?
harsh-harlequin
harsh-harlequin•4y ago
Nope those work too

Did you find this page helpful?