Skip to content

Commit df94bb8

Browse files
zdrawkuzdrawku
authored
Merge pull request #7386 from IgniteUI/nrobakova/fix-issue-7384
Focus grid body after closing row editing
2 parents ed72c8c + f535d34 commit df94bb8

File tree

6 files changed

+30
-8
lines changed

6 files changed

+30
-8
lines changed

‎projects/igniteui-angular/src/lib/grids/grid-base.directive.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6287,6 +6287,18 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
62876287
});
62886288
}
62896289
}
6290+
6291+
/**
6292+
* @hidden
6293+
* @internal
6294+
*/
6295+
public endRowEdit(commit = true, event?: Event) {
6296+
this.endEdit(commit, event);
6297+
const activeCell = this.navigation.activeNode;
6298+
if (activeCell && activeCell.row !== -1) {
6299+
this.tbody.nativeElement.focus();
6300+
}
6301+
}
62906302
/**
62916303
* @hidden
62926304
*/

‎projects/igniteui-angular/src/lib/grids/grid/grid-keyBoardNav.spec.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -434,7 +434,7 @@ describe('IgxGrid - Keyboard navigation #grid', () => {
434434
fix.detectChanges();
435435

436436
UIInteractions.triggerKeyDownEvtUponElem('end', cell.nativeElement, true, false, false, true);
437-
await wait(100);
437+
await wait(150);
438438
fix.detectChanges();
439439

440440
cell = grid.getCellByColumn(499, '49');

‎projects/igniteui-angular/src/lib/grids/grid/grid-mrl-keyboard-nav.spec.ts‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1693,6 +1693,7 @@ describe('IgxGrid Multi Row Layout - Keyboard navigation #grid', () => {
16931693
{ field: 'Fax', rowStart: 2, colStart: 1, colEnd: 3, rowEnd: 4 }
16941694
]
16951695
}];
1696+
await wait(DEBOUNCETIME);
16961697
fix.detectChanges();
16971698

16981699
setupGridScrollDetection(fix, fix.componentInstance.grid);
@@ -1704,6 +1705,8 @@ describe('IgxGrid Multi Row Layout - Keyboard navigation #grid', () => {
17041705
GridFunctions.simulateGridContentKeydown(fix, 'end', false, false, true);
17051706
await wait(200);
17061707
fix.detectChanges();
1708+
await wait(200);
1709+
fix.detectChanges();
17071710

17081711
expect(fix.componentInstance.selectedCell.value)
17091712
.toEqual(fix.componentInstance.data[fix.componentInstance.data.length - 1].Fax);
@@ -1712,6 +1715,8 @@ describe('IgxGrid Multi Row Layout - Keyboard navigation #grid', () => {
17121715
GridFunctions.simulateGridContentKeydown(fix, 'home', false, false, true);
17131716
await wait(200);
17141717
fix.detectChanges();
1718+
await wait(200);
1719+
fix.detectChanges();
17151720

17161721
expect(fix.componentInstance.selectedCell.value).toEqual(fix.componentInstance.data[0].CompanyName);
17171722
expect(fix.componentInstance.selectedCell.column.field).toMatch('CompanyName');
@@ -1816,6 +1821,7 @@ describe('IgxGrid Multi Row Layout - Keyboard navigation #grid', () => {
18161821
{ field: 'Fax', rowStart: 2, colStart: 1, colEnd: 3, rowEnd: 4 }
18171822
]
18181823
}];
1824+
await wait(DEBOUNCETIME);
18191825
fix.detectChanges();
18201826
setupGridScrollDetection(fix, fix.componentInstance.grid);
18211827
// last cell from first layout
@@ -1828,13 +1834,15 @@ describe('IgxGrid Multi Row Layout - Keyboard navigation #grid', () => {
18281834
GridFunctions.simulateGridContentKeydown(fix, 'End', false, false, true);
18291835
await wait(200);
18301836
fix.detectChanges();
1837+
await wait(200);
1838+
fix.detectChanges();
18311839

18321840
expect(fix.componentInstance.selectedCell.value)
18331841
.toEqual(fix.componentInstance.data[fix.componentInstance.data.length - 1].Fax);
18341842
expect(fix.componentInstance.selectedCell.column.field).toMatch('Fax');
18351843

18361844
GridFunctions.simulateGridContentKeydown(fix, 'Home', false, false, true);
1837-
await wait(100);
1845+
await wait(200);
18381846
fix.detectChanges();
18391847

18401848
expect(fix.componentInstance.selectedCell.value).toEqual(fix.componentInstance.data[0].CompanyName);
@@ -1872,6 +1880,7 @@ describe('IgxGrid Multi Row Layout - Keyboard navigation #grid', () => {
18721880
{ field: 'Fax', rowStart: 2, colStart: 1, colEnd: 3, rowEnd: 4 }
18731881
]
18741882
}];
1883+
await wait(DEBOUNCETIME);
18751884
fix.detectChanges();
18761885
const firstCell = fix.debugElement.queryAll(By.css(CELL_CSS_CLASS))[0];
18771886

@@ -1931,6 +1940,7 @@ describe('IgxGrid Multi Row Layout - Keyboard navigation #grid', () => {
19311940
{ field: 'Fax', rowStart: 2, colStart: 1, colEnd: 3, rowEnd: 4 }
19321941
]
19331942
}];
1943+
await wait(DEBOUNCETIME);
19341944
fix.detectChanges();
19351945
const rows = fix.debugElement.queryAll(By.css(ROW_CSS_CLASS));
19361946
const firstCell = rows[2].queryAll(By.css(CELL_CSS_CLASS))[0];

‎projects/igniteui-angular/src/lib/grids/grid/grid.component.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -291,8 +291,8 @@
291291
</ng-template>
292292

293293
<ng-template #defaultRowEditActions>
294-
<button igxButton igxRowEditTabStop (click)="endEdit(false, $event)">Cancel</button>
295-
<button igxButton igxRowEditTabStop (click)="endEdit(true, $event)">Done</button>
294+
<button igxButton igxRowEditTabStop (click)="endRowEdit(false, $event)">Cancel</button>
295+
<button igxButton igxRowEditTabStop (click)="endRowEdit(true, $event)">Done</button>
296296
</ng-template>
297297

298298
<ng-template #defaultRowEditTemplate>

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -237,8 +237,8 @@
237237
You have {{ rowChangesCount }} changes in this row
238238
</ng-template>
239239
<ng-template #defaultRowEditActions>
240-
<button igxButton igxRowEditTabStop (click)="endEdit(false, $event)">Cancel</button>
241-
<button igxButton igxRowEditTabStop (click)="endEdit(true, $event)">Done</button>
240+
<button igxButton igxRowEditTabStop (click)="endRowEdit(false, $event)">Cancel</button>
241+
<button igxButton igxRowEditTabStop (click)="endRowEdit(true, $event)">Done</button>
242242
</ng-template>
243243
<ng-template #defaultRowEditTemplate>
244244
<div class="igx-banner__message">

‎projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.component.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -206,8 +206,8 @@
206206
</ng-template>
207207

208208
<ng-template #defaultRowEditActions>
209-
<button igxButton igxRowEditTabStop (click)="endEdit(false, $event)">Cancel</button>
210-
<button igxButton igxRowEditTabStop (click)="endEdit(true, $event)">Done</button>
209+
<button igxButton igxRowEditTabStop (click)="endRowEdit(false, $event)">Cancel</button>
210+
<button igxButton igxRowEditTabStop (click)="endRowEdit(true, $event)">Done</button>
211211
</ng-template>
212212

213213
<ng-template #defaultRowEditTemplate>

0 commit comments

Comments
 (0)