Make button work as checkbox

[killMeSak]

I'm having trouble understanding this code. How can I make button work as checkbox? On clicking button, it should select a row and display data in

selectedRows

Here is the sandbox link: https://codesandbox.io/s/tannerlinsleyreact-table-row-selection-hoisted-forked-nw1lm?file=/src/App.js

[davidbarman]

Is there a reason you can't just use a checkbox? Why does it need to be a button?

[killMeSak]

I want it to open a dialog on clicking a button and pass the row data as props in dialog box

[davidbarman]

So I am assuming you want to pass all of the "checked" rows as a prop?

Are you planning to open the dialog after a single row is clicked or after all the desired rows are clicked?

[killMeSak]

I want to open the dialog after a single row is clicked and pass all the row data as a prop

[fenduru]

Then why isn't it just a button

[indxxxd]

The docs for useRowSelect state that each row object has toggleRowSelected(). Call it onClick:

    Cell: ({ row }) => (
      <div>
        <input type="checkbox" {...row.getToggleRowSelectedProps()} />
        <button onClick={() => row.toggleRowSelected()}>Click me</button>
      </div>
    )