How add row selection functionality on action in material table

Viewed 274

I want to add selection functionality on action of materila-table. Below is code snippet which select only one row not multiple row.

Basically I want to display an icon in action column and give selection functionality on that. And I am able to change the icon colour of the selected row.

Or is there any way to replace the selection checkboxes with an icon?

const [selected, setSelected] = useState();

actions={[
 rowData => {
  const active = rowData && selected && rowData.tableData.id === selected.tableData.id;
  return {
   tooltip: 'select incident',
   icon: () => <AddCircleOutlinedIcon color={active ? "warning" : "inherit"} />,
   onClick: (event, info) => {
    setSelected(info);
   }
  };
 }
]}

options={{
 search: true,
 selection: false,
 headerStyle: {
  backgroundColor: '#808284',
  color: '#FFF',
 },
 rowStyle: {
  backgroundColor: '#EEE',
 },
 paging: true,
 pageSize: 10,
 grouping: true,
 columnsButton: true,
}} 
0 Answers
Related