We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
New Product LaunchBoldDesk: Help desk ticketing software starts at $10 for 3 agents.
Try it for free.|
@Component({
selector: 'app-root',
template: '<button (click)="refresh($event)"> Refresh</button>
<ejs-grid #grid [dataSource]='data' allowSorting="true" [allowGrouping]="true" [groupSettings]="groupOptions"
(dataBound)='dataBound()' (actionBegin)="begin($event)" (actionComplete)="complete($event)" >
<e-columns>
. . .
</e-columns>
</ejs-grid>',
})
export class AppComponent {
. . .
ngOnInit(): void {
this.data = inventoryData.slice(0,10);
this.groupOptions = { showGroupedColumn: false, columns: ['Country'] };
}
dataBound() {
if(this.initial){
this.grid.groupModule.collapseAll();
this.initial = false;
}
}
begin(e){
if(e.requestType == 'refresh'){
// storing the expanded row index in a variable
let indexes: number[] = [];
let elements = this.grid.element.querySelectorAll('.e-recordplusexpand');
for (let i = 0; i < elements.length; i++) {
let tr = elements[i].closest('tr');
indexes.push((tr as HTMLTableRowElement).rowIndex);
}
this.state = indexes;
}
}
complete(e){
if(e.requestType == 'refresh'){
if (this.state.length) {
let elements = this.grid.getContentTable().querySelectorAll('tr');
for (let i = 0; i < elements.length; i++) {
let icon = elements[i].querySelector('.e-recordplusexpand');
if(icon && !this.state.filter(ele=>ele==i).length ){
(icon as any).click(); // collapse the row after refreshing
}
}
}else{
this.grid.groupModule.collapseAll();
}
}
}
refresh(e){
this.grid.refresh(); // refreshed the Grid manually
}
} |
