|
export class Hierarchy extends SampleBase {
constructor() {
super(...arguments);
this.toolbarSettings = ['Add', 'Edit', 'Delete',
{ text: 'Copy', prefixIcon: 'e-copy', id: 'cpy' },
{ text: 'Attach', prefixIcon: 'e-add', id: 'att' },
];
this.sequenceToolbarSettings = [
{ text: 'Attach', prefixIcon: 'e-link-icon', id: 'att' },
{ text: 'Detach', prefixIcon: 'e-unlink-icon', id: 'det' },
];
this.childGrid = {
dataSource: orderDatas,
queryString: 'EmployeeID',
toolbar: this.sequenceToolbarSettings,
toolbarClick: this.sequenceClickHandler,
. . .
};
}
clickHandler = (args) => {
if(args.item.id =='att'){
let asm = this.grid.getSelectedRecords();
console.log(asm);
return;
}
}
sequenceClickHandler = (args) => {
if(args.item.id =='att'){
var seqGrid = parentsUntil(args.originalEvent.target,"e-grid").ej2_instances[0];
let seq = seqGrid.getSelectedRecords();
console.log(seq);
return;
}
}
render() {
return (<div className='control-pane'>
<div className='control-section'>
<GridComponent dataSource={employeeData} childGrid={this.childGrid}
toolbar={this.toolbarSettings}
toolbarClick={this.clickHandler}
ref={g => this.grid = g}
allowSorting={true}>
<ColumnsDirective>
. . .
</ColumnsDirective>
<Inject services={[DetailRow, Toolbar, Page, Sort]}/>
</GridComponent>
</div>
</div>);
}
}
render(<Hierarchy />, document.getElementById('sample')); | 
