Skip to content

Commit 308f045

Browse files
kdinevkdinev
authored
Merge pull request #8918 from IgniteUI/hanastasov/exitedit-on-events-m
End edit and discard editing value on interactions
2 parents 81c2de0 + 3453488 commit 308f045

File tree

12 files changed

+46
-51
lines changed

12 files changed

+46
-51
lines changed

‎projects/igniteui-angular/src/lib/grids/api.service.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -511,7 +511,7 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
511511
expandedStates.set(rowID, expanded);
512512
grid.expansionStates = expandedStates;
513513
if (grid.rowEditable) {
514-
grid.endEdit(true);
514+
grid.endEdit(false);
515515
}
516516
}
517517

‎projects/igniteui-angular/src/lib/grids/columns/column.component.ts‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1747,7 +1747,6 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy {
17471747
// TODO: Probably should the return type of the old functions
17481748
// should be moved as a event parameter.
17491749
const grid = (this.grid as any);
1750-
17511750
if (this._pinned) {
17521751
return false;
17531752
}
@@ -1774,7 +1773,7 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy {
17741773
return;
17751774
}
17761775

1777-
grid.endEdit(true);
1776+
grid.endEdit(false);
17781777

17791778
this._pinned = true;
17801779
this.pinnedChange.emit(this._pinned);
@@ -1865,7 +1864,7 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy {
18651864
return;
18661865
}
18671866

1868-
this.grid.endEdit(true);
1867+
this.grid.endEdit(false);
18691868

18701869
this._pinned = false;
18711870
this.pinnedChange.emit(this._pinned);

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

Lines changed: 9 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1476,7 +1476,7 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
14761476
if (this.totalPages !== 0 && this._page >= this.totalPages) {
14771477
this.page = this.totalPages - 1;
14781478
}
1479-
this.endEdit(true);
1479+
this.endEdit(false);
14801480
this.notifyChanges();
14811481
}
14821482

@@ -1962,7 +1962,7 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
19621962
public set summaryCalculationMode(value: GridSummaryCalculationMode) {
19631963
this._summaryCalculationMode = value;
19641964
if (!this._init) {
1965-
this.endEdit(true);
1965+
this.endEdit(false);
19661966
this.summaryService.resetSummaryHeight();
19671967
this.notifyChanges(true);
19681968
}
@@ -3355,8 +3355,7 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
33553355
});
33563356
});
33573357

3358-
this.onColumnMoving.pipe(destructor).subscribe(() => this.endEdit(true));
3359-
this.onColumnResized.pipe(destructor).subscribe(() => this.endEdit(true));
3358+
this.onColumnMovingEnd.pipe(destructor).subscribe(() => this.endEdit(false));
33603359

33613360
this.overlayService.onOpening.pipe(destructor).subscribe((event) => {
33623361
if (this._advancedFilteringOverlayId === event.id) {
@@ -3424,15 +3423,15 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
34243423
});
34253424

34263425
this.onDensityChanged.pipe(destructor).subscribe(() => {
3427-
this.endEdit(true);
3426+
this.endEdit(false);
34283427
this.summaryService.summaryHeight = 0;
34293428
this.notifyChanges(true);
34303429
});
34313430
}
34323431

34333432
/** @hidden @internal */
34343433
public _pagingDone() {
3435-
this.endEdit(true);
3434+
this.endEdit(false);
34363435
this.selectionService.clear(true);
34373436
}
34383437

@@ -4296,7 +4295,6 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
42964295
return;
42974296
}
42984297

4299-
this.endEdit(true);
43004298
if (column.level) {
43014299
this._moveChildColumns(column.parent, column, target, pos);
43024300
}
@@ -4326,6 +4324,8 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
43264324

43274325
this._moveColumns(column, target, pos);
43284326
this._columnsReordered(column, target);
4327+
4328+
this.onColumnMovingEnd.emit({ source: column, target });
43294329
}
43304330

43314331
/**
@@ -4758,7 +4758,7 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
47584758
};
47594759
this.onRowPinning.emit(eventArgs);
47604760

4761-
this.endEdit(true);
4761+
this.endEdit(false);
47624762

47634763
const insertIndex = typeof eventArgs.insertAtIndex === 'number' ? eventArgs.insertAtIndex : this._pinnedRecordIDs.length;
47644764
this._pinnedRecordIDs.splice(insertIndex, 0, rowID);
@@ -4791,7 +4791,7 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
47914791
row
47924792
};
47934793
this.onRowPinning.emit(eventArgs);
4794-
this.endEdit(true);
4794+
this.endEdit(false);
47954795
this._pinnedRecordIDs.splice(index, 1);
47964796
this._pipeTrigger++;
47974797
if (this.gridAPI.grid) {
@@ -6946,13 +6946,6 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
69466946
// after reordering is done reset cached column collections.
69476947
this.resetColumnCollections();
69486948
column.resetCaches();
6949-
6950-
const args = {
6951-
source: column,
6952-
target
6953-
};
6954-
6955-
this.onColumnMovingEnd.emit(args);
69566949
}
69576950

69586951
private _applyWidthHostBinding() {

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

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -133,6 +133,7 @@ describe('IgxGrid - Column Moving #grid', () => {
133133
it('Should exit edit mode and commit the new value when column moving programmatically', () => {
134134
fixture.componentInstance.isEditable = true;
135135
fixture.detectChanges();
136+
const cacheValue = grid.getCellByColumn(0, 'ID').value;
136137

137138
// step 1 - enter edit mode on a cell
138139
const cell = fixture.debugElement.queryAll(By.css(CELL_CSS_CLASS))[0];
@@ -158,7 +159,7 @@ describe('IgxGrid - Column Moving #grid', () => {
158159
// step 4 - verify cell has exited edit mode correctly
159160
expect(grid.columnList.toArray()[2].field).toEqual('ID');
160161
expect(grid.getCellByColumn(0, 'ID').editMode).toBe(false);
161-
expect(grid.getCellByColumn(0, 'ID').value).toBe('4');
162+
expect(grid.getCellByColumn(0, 'ID').value).toBe(cacheValue);
162163
});
163164

164165
it('Should preserve hidden columns order after columns are reordered programmatically', () => {
@@ -533,14 +534,15 @@ describe('IgxGrid - Column Moving #grid', () => {
533534
expect(grid.rowList.length).toEqual(1);
534535
});
535536

536-
it('Should exit edit mode and commit the new value when column moving starts.', (async () => {
537+
it('Should exit edit mode and discard the new value when column moving starts.', (async () => {
537538
fixture.componentInstance.isEditable = true;
538539
fixture.detectChanges();
539540

540541
const headers: DebugElement[] = fixture.debugElement.queryAll(By.css(COLUMN_HEADER_CLASS));
541542

542543
// step 1 - enter edit mode on a cell
543544
const cell = fixture.debugElement.queryAll(By.css(CELL_CSS_CLASS))[0];
545+
const cacheValue = grid.getCellByColumn(0, 'ID').value;
544546
cell.nativeElement.dispatchEvent(new Event('focus'));
545547
fixture.detectChanges();
546548

@@ -569,7 +571,7 @@ describe('IgxGrid - Column Moving #grid', () => {
569571
// step 4 - verify cell has exited edit mode correctly
570572
expect(grid.columnList.toArray()[1].field).toEqual('ID');
571573
expect(grid.getCellByColumn(0, 'ID').editMode).toBe(false);
572-
expect(grid.getCellByColumn(0, 'ID').value).toBe('4');
574+
expect(grid.getCellByColumn(0, 'ID').value).toBe(cacheValue);
573575
}));
574576

575577
it('Should preserve hidden columns order after columns are reordered.', (async () => {

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

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -607,9 +607,7 @@ describe('IgxGrid - Row Adding #grid', () => {
607607

608608
GridFunctions.navigateToLastPage(grid.nativeElement);
609609
fixture.detectChanges();
610-
expect(grid.data.length).toBe(dataLength + 1);
611-
const addedRow = grid.data[grid.data.length - 1];
612-
expect(addedRow).toBe(grid.rowList.last.rowData);
610+
expect(grid.data.length).toBe(dataLength);
613611
});
614612

615613
it('Should save changes when changing page count', () => {
@@ -630,7 +628,7 @@ describe('IgxGrid - Row Adding #grid', () => {
630628
const selectList = fixture.debugElement.query(By.css('.igx-drop-down__list-scroll'));
631629
selectList.children[2].nativeElement.click();
632630
fixture.detectChanges();
633-
expect(grid.data.length).toBe(dataLength + 1);
631+
expect(grid.data.length).toBe(dataLength);
634632
});
635633
});
636634

@@ -903,7 +901,7 @@ describe('IgxGrid - Row Adding #grid', () => {
903901
fixture.detectChanges();
904902

905903
expect(grid.endEdit).toHaveBeenCalled();
906-
expect(grid.data.length).toBe(dataLength + 1);
904+
expect(grid.data.length).toBe(dataLength);
907905
expect(grid.rowEditingOverlay.collapsed).toEqual(true);
908906
});
909907

@@ -922,7 +920,7 @@ describe('IgxGrid - Row Adding #grid', () => {
922920
fixture.detectChanges();
923921

924922
expect(grid.endEdit).toHaveBeenCalled();
925-
expect(grid.data.length).toBe(dataLength + 1);
923+
expect(grid.data.length).toBe(dataLength);
926924
expect(grid.rowEditingOverlay.collapsed).toEqual(true);
927925

928926
row.beginAddRow();
@@ -932,7 +930,7 @@ describe('IgxGrid - Row Adding #grid', () => {
932930
fixture.detectChanges();
933931

934932
expect(grid.endEdit).toHaveBeenCalled();
935-
expect(grid.data.length).toBe(dataLength + 2);
933+
expect(grid.data.length).toBe(dataLength);
936934
expect(grid.rowEditingOverlay.collapsed).toEqual(true);
937935
});
938936

@@ -963,8 +961,8 @@ describe('IgxGrid - Row Adding #grid', () => {
963961
fixture.detectChanges();
964962

965963
expect(grid.endEdit).toHaveBeenCalled();
966-
expect(grid.data.length).toBe(dataLength + 1);
967-
expect(grid.rowEditingOverlay.collapsed).toEqual(true);
964+
expect(grid.data.length).toBe(dataLength);
965+
expect(grid.rowEditingOverlay.collapsed).toEqual(false);
968966
});
969967

970968
it('Should exit add row mode when hiding a column', () => {

‎projects/igniteui-angular/src/lib/grids/grid/grid-api.service.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,7 @@ export class IgxGridAPIService extends GridBaseAPIService<IgxGridComponent> {
8787
public groupBy_toggle_group(groupRow: IGroupByRecord) {
8888
const grid = this.grid;
8989
if (grid.crudService.cellInEditMode) {
90-
grid.endEdit(true);
90+
grid.endEdit(false);
9191
}
9292

9393
const expansionState = grid.groupingExpansionState;

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

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -340,6 +340,7 @@ describe('IgxGrid - Cell Editing #grid', () => {
340340

341341
it('edit mode - exit edit mode and submit when pin/unpin unpin column', fakeAsync(/** height/width setter rAF */() => {
342342
let cell = grid.getCellByColumn(0, 'firstName');
343+
const cacheValue = cell.value;
343344
const cellDom = fixture.debugElement.queryAll(By.css(CELL_CSS_CLASS))[0];
344345

345346
UIInteractions.simulateDoubleClickAndSelectEvent(cell);
@@ -355,7 +356,7 @@ describe('IgxGrid - Cell Editing #grid', () => {
355356
expect(grid.crudService.cell).toBeNull();
356357
expect(grid.pinnedColumns.length).toBe(1);
357358
cell = grid.getCellByColumn(0, 'firstName');
358-
expect(cell.value).toBe('Gary Martin');
359+
expect(cell.value).toBe(cacheValue);
359360
cell = grid.getCellByColumn(1, 'firstName');
360361
const cellValue = cell.value;
361362
cell.setEditMode(true);

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

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1153,6 +1153,7 @@ describe('IgxGrid - Row Editing #grid', () => {
11531153
grid.perPage = 7;
11541154
fix.detectChanges();
11551155

1156+
const cacheValue = cell.value;
11561157
let rowElement = grid.getRowByIndex(0).nativeElement;
11571158
expect(rowElement.classList).not.toContain(ROW_EDITED_CLASS);
11581159

@@ -1176,16 +1177,17 @@ describe('IgxGrid - Row Editing #grid', () => {
11761177
// Previous page button click
11771178
GridFunctions.navigateToPrevPage(grid.nativeElement);
11781179
fix.detectChanges();
1179-
expect(cell.value).toBe('IG');
1180+
expect(cell.value).toBe(cacheValue);
11801181
rowElement = grid.getRowByIndex(0).nativeElement;
11811182
expect(rowElement.classList).not.toContain(ROW_EDITED_CLASS);
11821183
});
11831184

1184-
it(`Paging: Should save changes when changing page while editing`, () => {
1185+
it(`Paging: Should discard changes when changing page while editing`, () => {
11851186
grid.paging = true;
11861187
grid.perPage = 7;
11871188
fix.detectChanges();
11881189

1190+
const cacheValeue = cell.value;
11891191
cell.setEditMode(true);
11901192
cell.update('IG');
11911193

@@ -1204,7 +1206,7 @@ describe('IgxGrid - Row Editing #grid', () => {
12041206
fix.detectChanges();
12051207

12061208
expect(cell.editMode).toBeFalsy();
1207-
expect(cell.value).toBe('IG');
1209+
expect(cell.value).toBe(cacheValeue);
12081210
});
12091211

12101212
it(`Paging: Should exit edit mode when changing the page size while editing`, () => {
@@ -1452,7 +1454,7 @@ describe('IgxGrid - Row Editing #grid', () => {
14521454

14531455
expect(cell.editMode).toBeFalsy();
14541456
expect(grid.endEdit).toHaveBeenCalled();
1455-
expect(grid.endEdit).toHaveBeenCalledWith(true);
1457+
expect(grid.endEdit).toHaveBeenCalledWith(false);
14561458
expect(grid.rowEditingOverlay.collapsed).toEqual(true);
14571459
});
14581460

@@ -1467,7 +1469,7 @@ describe('IgxGrid - Row Editing #grid', () => {
14671469
fix.detectChanges();
14681470

14691471
expect(grid.endEdit).toHaveBeenCalled();
1470-
expect(grid.endEdit).toHaveBeenCalledWith(true);
1472+
expect(grid.endEdit).toHaveBeenCalledWith(false);
14711473
expect(grid.endEdit).toHaveBeenCalledTimes(1);
14721474
expect(cell.editMode).toBeFalsy();
14731475

@@ -1481,12 +1483,12 @@ describe('IgxGrid - Row Editing #grid', () => {
14811483
fix.detectChanges();
14821484

14831485
expect(grid.endEdit).toHaveBeenCalled();
1484-
expect(grid.endEdit).toHaveBeenCalledWith(true);
1486+
expect(grid.endEdit).toHaveBeenCalledWith(false);
14851487
expect(grid.endEdit).toHaveBeenCalledTimes(2);
14861488
expect(cell.editMode).toBeFalsy();
14871489
});
14881490

1489-
it(`Resizing: Should exit edit mode when resizing a column`, fakeAsync(() => {
1491+
it(`Resizing: Should keep edit mode when resizing a column`, fakeAsync(() => {
14901492
spyOn(grid, 'endEdit').and.callThrough();
14911493

14921494
// put cell in edit mode
@@ -1506,9 +1508,8 @@ describe('IgxGrid - Row Editing #grid', () => {
15061508
UIInteractions.simulateMouseEvent('mouseup', resizer, 550, 0);
15071509
fix.detectChanges();
15081510

1509-
expect(grid.endEdit).toHaveBeenCalled();
1510-
expect(grid.endEdit).toHaveBeenCalledWith(true);
1511-
expect(cell.editMode).toBeFalsy();
1511+
expect(grid.endEdit).toHaveBeenCalledTimes(0);
1512+
expect(cell.editMode).toBeTruthy();
15121513
}));
15131514

15141515
it(`Hiding: Should exit edit mode when hiding a column`, () => {

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -624,7 +624,7 @@ export class IgxGridComponent extends IgxGridBaseDirective implements GridType,
624624
if (this.checkIfNoColumnField(expression)) {
625625
return;
626626
}
627-
this.endEdit(true);
627+
this.endEdit(false);
628628
if (expression instanceof Array) {
629629
this._gridAPI.groupBy_multiple(expression);
630630
} else {
@@ -993,7 +993,7 @@ export class IgxGridComponent extends IgxGridBaseDirective implements GridType,
993993
public ngOnInit() {
994994
super.ngOnInit();
995995
this.onGroupingDone.pipe(takeUntil(this.destroy$)).subscribe((args) => {
996-
this.endEdit(true);
996+
this.endEdit(false);
997997
this.summaryService.updateSummaryCache(args);
998998
this._headerFeaturesWidth = NaN;
999999
});

‎projects/igniteui-angular/src/lib/grids/grid/row-drag.directive.spec.ts‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -847,7 +847,7 @@ describe('Row Drag Tests #grid', () => {
847847
groupRow = groupHeader.records.find(element => element['ID'] === rowCells[1].value);
848848
expect(groupRow).toBeDefined();
849849
});
850-
it('should exit edit mode and commit changes on row dragging', () => {
850+
it('should exit edit mode and discard changes on row dragging', () => {
851851
dragGrid.rowEditable = true;
852852
fixture.detectChanges();
853853

@@ -863,6 +863,7 @@ describe('Row Drag Tests #grid', () => {
863863
pointerUpEvent = UIInteractions.createPointerEvent('pointerup', dropPoint);
864864

865865
const dragCell = dragGrid.getCellByColumn(1, 'Downloads');
866+
const cacheValue = dragCell.value;
866867
const cellElement = dragCell.nativeElement;
867868
let cellInput = null;
868869

@@ -898,8 +899,8 @@ describe('Row Drag Tests #grid', () => {
898899
expect(row.grid.rowDragging).toBeFalsy();
899900

900901
const dropCell = dropGrid.getCellByColumn(0, 'Downloads');
901-
expect(dropCell.value).toEqual(newCellValue);
902-
expect(dragCell.value).toEqual(newCellValue);
902+
expect(dropCell.value).toEqual(cacheValue);
903+
expect(dragCell.value).toEqual(cacheValue);
903904
});
904905
});
905906
});

0 commit comments

Comments
 (0)