BoldSignEasily embed eSignatures in your .NET applications. Free sandbox with native SDK available.
<div class="row">
<div class="col-sm-6">
<ejs-grid id='DestGrid' #destGrid [dataSource]='practiceModifiers' [allowSelection]="true"
[allowRowDragAndDrop]="true"
[selectionSettings]="{ type: 'Multiple' }">
<e-columns>
<e-column headerText="Available Modifiers">
<ng-template #template let-data>
<div>
<span>{{ data | formatModifierInfo }}</span>
</div>
</ng-template>
</e-column>
</e-columns>
</ejs-grid>
</div>
<div class="col-sm-6">
<ejs-grid id='SourceGrid' #sourceGrid [dataSource]='masterModifiers' [allowSelection]="true"
[allowRowDragAndDrop]="true" [selectionSettings]="{ type: 'Multiple' }"
[rowDropSettings]="{ targetID: 'DestGrid' }">
<e-columns>
<e-column headerText="Practice Modifiers">
<ng-template #template let-data>
<div>
<span>{{ data | formatModifierInfo }}</span>
</div>
</ng-template>
</e-column>
</e-columns>
</ejs-grid>
</div>
</div>
...
export class DragAndDropComponent implements OnInit {
...
public flag: boolean = true;
ngOnInit(): void {
this.srcData = orderDetails;
...
}
rowDrop(args: any) {
this.idx = args.fromIndex;
this.dta = args.data;
}
rowDragStart(args: any){
this.flag = true;
}
actionBegin(args: any) {
if (args.requestType == "rowdraganddrop") {
if (this.flag === true) {
this.flag = false;
this.grid.notify("rows-added", { toIndex: this.idx, records: this.dta });
this.grid.notify('model-changed', {
type: 'actionBegin', requestType: 'rowdraganddrop'
});
}
}
}
} |