hyojin / material-ui-datatables

An another React Data tables component.
MIT License
165 stars 58 forks source link

how to create customer column for Edit/Delete? #11

Open thearabbit opened 7 years ago

thearabbit commented 7 years ago

I would like to create customer column for Edit/Delete

image

hyojin commented 7 years ago

@thearabbit Hi, Currently it doesn't support edit features in the component. But if you want to show dropdown and implement edit features by yourself, you can set react nodes as values in data props. for example,

const data = [{
  date: '30/03/2017',
  action: (<DropDownMenu>...),
  ...
}];
thearabbit commented 7 years ago

OK, thanks for your reply. I will try soon.

thearabbit commented 7 years ago

I would like to custom action field with current data row

const data = [{
  _id: '01'
  date: '30/03/2017',
  action: (
    <IconMenu
           iconButtonElement={<IconButton><MoreVertIcon /></IconButton>}
           anchorOrigin={{ horizontal: 'right', vertical: 'top' }}
           targetOrigin={{ horizontal: 'right', vertical: 'top' }}
   >
                <MenuItem
                primaryText="Edit"
                onTouchTap={(event) => this.handleEdit(this._id)}
                 />
                 <MenuItem
                     primaryText="Delete"
                     onTouchTap={(event) => this.handleOpenConfirmDel(this._id)}
                  />
    </IconMenu>
  )
  ...
}];

Please help me to get this doc of current row like above

hyojin commented 7 years ago

Considering the scope of your event handler function, In this case, I would say using call method with specific arguments is a solution. And I think the other way is getting from dom using html5 data attribute.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call