I would like to implement copy, cut, paste actions in ag grid. Ag grid enterprise features contain all what I need except for cut action. I think it can be implemented by adding keydown event handler to the component. The process would be consisted of just copying and erasing the cells data. But the problem is I couldn't find the which row and column I copied, the position of the cell. any idea?
...
constructor(props) {
super(props);
this.state = {
columnDefs: [
{
headerName: "Athlete",
field: "athlete",
width: 150,
suppressSizeToFit: true
},
{
headerName: "Age",
field: "age",
width: 90,
minWidth: 50,
maxWidth: 100
},
...
],
defaultColDef: { editable: true },
rowSelection: "multiple",
clipboardDeliminator: ",",
rowData: []
};
}
onKeyDown(evt) {
if (evt.key == "x" && (evt.ctrlKey || evt.metaKey)) {
this.gridApi.copySelectedRangeToClipboard();
// here should add some code
}
}
render() {
return (
id="myGrid"
style={{
boxSizing: "border-box",
height: "100%",
width: "100%"
}}
className="ag-theme-balham"
onKeyDown={this.onKeyDown.bind(this)}
>
columnDefs={this.state.columnDefs}
defaultColDef={this.state.defaultColDef}
enableRangeSelection={true}
rowSelection={this.state.rowSelection}
clipboardDeliminator={this.state.clipboardDeliminator}
onGridReady={this.onGridReady.bind(this)}
rowData={this.state.rowData}
/>
);
}
}
...