public copy(){ if (this.gridInstance) { this.gridInstance.copy(); } }
Now my problem is to do the paste after a given point.
Index.js
. . .
export class Clipboard extends SampleBase {
constructor() {
super(...arguments);
this.gridSelectedRecords = [];
this.selectionsettings = { type: 'Multiple' };
this.editSettings = {allowAdding: true, allowDeleting: true}
}
keyPressHandler (args) {
if (args.action == "ctrlPlusC") {
// here we are storing the selected records to perform copy operation
this.gridSelectedRecords = this.gridInstance.getSelectedRecords();
}
if (args.ctrlKey && args.code === 'KeyX') {
// here we are storing the selected records
this.gridSelectedRecords = this.gridInstance.getSelectedRecords();
// here we are deleting the selected records to perform cut opeartion
this.gridInstance.deleteRecord();
}
if (args.ctrlKey && args.code === 'KeyV') {
var index = this.gridInstance.selectedRowIndex;
// pasting the records using addRecord method
if (this.gridSelectedRecords.length) {
this.gridSelectedRecords.forEach((record , i)=> {
this.gridInstance.addRecord(record, index);
index++
})
}
}
}
created () {
this.gridInstance.element.addEventListener('keydown', this.keyPressHandler.bind(this)) };
render() {
return (<div className='control-pane'>
<div className='control-section'>
<GridComponent dataSource={data} editSettings={this.editSettings} created={this.created.bind(this)}
ref={grid => this.gridInstance = grid} enableHover={false} allowPaging={true} pageSettings={{ pageCount: 5 }} selectionSettings={this.selectionsettings}>
. . .
<Inject services={[Page,Edit, Selection,]}/>
</GridComponent>
</div>
</div>);
}
}
render(<Clipboard />, document.getElementById('sample'));
|