CODEWITHSUNDEEP
material-uiadmin-on-rest
Marcus Geduld
Marcus Geduld

Reputation: 51

How do I add checkboxes to admin-on-rest datagrid component?

The Datagrid component wraps material-ui's Table component, According to the admin-on-rest documentation, you can pass material-ui Table options (e.g. the ones that show checkboxes) via the headerOptions, rowOptions, bodyOptions, and options properties. According to the material-ui docs, the options are showCheckboxes and selectable. I also found mention of some others online, such as displayRowCheckboxes.

As you can see in the following code, I have gone nuts trying everything. Nothing has worked. 

<List {...props} sort={{ field: "id", order: "ASC" }}>
<Datagrid 
  headerOptions={{displaySelectAll: true}} 
  rowOptions={{selectable: true}}
  bodyOptions={{showCheckboxes: true, displayRowCheckBox: true}} 
  options={{showCheckboxes: true, onRowSelection: ()=>{}}}>
  <TextField label="FIRST NAME" source="first_name" />
  <TextField label="LAST NANE" source="last_name" />
  <EditButton />
</Datagrid>
</List>;

This is getting me an uncheckable header checkbox, but no row checkboxes:

enter image description here

Upvotes: 1

Views: 793

Answers (1)

Marcus Geduld
Marcus Geduld

Reputation: 51

Answer to my own question: 

<Datagrid 
  headerOptions={{ adjustForCheckbox: true, displaySelectAll: true }} 
  bodyOptions={{ displayRowCheckbox: true }} 
  rowOptions={{ selectable: true }} 
  options={{ multiSelectable: true }}>
  <TextField label="FIRST NAME" source="first_name" />
  <TextField label="LAST BANE" source="last_name" />
  <EditButton />
</Datagrid>

;

Upvotes: 4

Related Questions