Skip to content

Commit 9b39953

Browse files
simeonoffsimeonoff
authored
Merge branch 'master' into elevation-schemas
2 parents 2df0f42 + 0b9be32 commit 9b39953

File tree

7 files changed

+167
-66
lines changed

7 files changed

+167
-66
lines changed

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

Lines changed: 23 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1986,49 +1986,6 @@ export abstract class IgxGridBaseComponent extends DisplayDensityBase implements
19861986
this.cdr.markForCheck();
19871987
}
19881988

1989-
/**
1990-
* Returns the state of the grid virtualization, including the start index and how many records are rendered.
1991-
* ```typescript
1992-
* const gridVirtState = this.grid1.virtualizationState;
1993-
* ```
1994-
* @memberof IgxGridBaseComponent
1995-
*/
1996-
get virtualizationState() {
1997-
return this.verticalScrollContainer.state;
1998-
}
1999-
2000-
/**
2001-
* @hidden
2002-
*/
2003-
set virtualizationState(state) {
2004-
this.verticalScrollContainer.state = state;
2005-
}
2006-
2007-
/**
2008-
* Returns the total number of records in the data source.
2009-
* Works only with remote grid virtualization.
2010-
* ```typescript
2011-
* const itemCount = this.grid1.totalItemCount;
2012-
* ```
2013-
* @memberof IgxGridBaseComponent
2014-
*/
2015-
get totalItemCount() {
2016-
return this.verticalScrollContainer.totalItemCount;
2017-
}
2018-
2019-
/**
2020-
* Sets the total number of records in the data source.
2021-
* This property is required for virtualization to function when the grid is bound remotely.
2022-
* ```typescript
2023-
* this.grid1.totalItemCount = 55;
2024-
* ```
2025-
* @memberof IgxGridBaseComponent
2026-
*/
2027-
set totalItemCount(count) {
2028-
this.verticalScrollContainer.totalItemCount = count;
2029-
this.cdr.detectChanges();
2030-
}
2031-
20321989
/**
20331990
* @hidden
20341991
*/
@@ -4041,7 +3998,7 @@ export abstract class IgxGridBaseComponent extends DisplayDensityBase implements
40413998
* @hidden
40423999
*/
40434000
protected get defaultTargetBodyHeight(): number {
4044-
const allItems = this.totalItemCount || this.dataLength;
4001+
const allItems = this.dataLength;
40454002
return this.renderedRowHeight * Math.min(this._defaultTargetRecordNumber,
40464003
this.paging ? Math.min(allItems, this.perPage) : allItems);
40474004
}
@@ -4831,28 +4788,26 @@ export abstract class IgxGridBaseComponent extends DisplayDensityBase implements
48314788
}
48324789

48334790
extractDataFromSelection(source: any[]): any[] {
4834-
let column: IgxColumnComponent;
4791+
let columnsArray: IgxColumnComponent[];
48354792
let record = {};
48364793
const selectedData = [];
48374794

48384795
const selectionMap = Array.from(this.selectionService.selection)
48394796
.filter((tuple) => tuple[0] < source.length);
48404797

4841-
const visibleColumns = this.visibleColumns
4842-
.filter(col => !col.columnGroup)
4843-
.sort((a, b) => a.visibleIndex - b.visibleIndex);
4844-
48454798

48464799
for (const [row, set] of selectionMap) {
48474800
if (!source[row]) {
48484801
continue;
48494802
}
48504803
const temp = Array.from(set);
48514804
for (const each of temp) {
4852-
column = visibleColumns[each];
4853-
if (column) {
4854-
record[column.field] = source[row][column.field];
4855-
}
4805+
columnsArray = this.getSelectableColumnsAt(each);
4806+
columnsArray.forEach((col) => {
4807+
if (col) {
4808+
record[col.field] = source[row][col.field];
4809+
}
4810+
});
48564811
}
48574812
if (Object.keys(record).length) {
48584813
selectedData.push(record);
@@ -4862,6 +4817,21 @@ export abstract class IgxGridBaseComponent extends DisplayDensityBase implements
48624817
return selectedData;
48634818
}
48644819

4820+
protected getSelectableColumnsAt(index) {
4821+
if (this.hasColumnLayouts) {
4822+
const visibleLayoutColumns = this.visibleColumns
4823+
.filter(col => col.columnLayout)
4824+
.sort((a, b) => a.visibleIndex - b.visibleIndex);
4825+
const colLayout = visibleLayoutColumns[index];
4826+
return colLayout ? colLayout.children.toArray() : [];
4827+
} else {
4828+
const visibleColumns = this.visibleColumns
4829+
.filter(col => !col.columnGroup)
4830+
.sort((a, b) => a.visibleIndex - b.visibleIndex);
4831+
return [ visibleColumns[index] ];
4832+
}
4833+
}
4834+
48654835
getSelectedData() {
48664836
const source = this.verticalScrollContainer.igxForOf;
48674837

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

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -131,7 +131,7 @@ export class IgxGridNavigationService {
131131
if (this.isColumnLeftEdgeVisible(visibleColumnIndex + 1)) {
132132
element.nextElementSibling.firstElementChild.focus({ preventScroll: true });
133133
} else {
134-
this.grid.nativeElement.focus({ preventScroll: true });
134+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
135135
this.grid.parentVirtDir.onChunkLoad
136136
.pipe(first())
137137
.subscribe(() => {
@@ -205,7 +205,7 @@ export class IgxGridNavigationService {
205205
if (this.grid.pinnedColumns.length || this.displayContainerScrollLeft === 0) {
206206
firstCell.focus({ preventScroll: true });
207207
} else {
208-
this.grid.nativeElement.focus({ preventScroll: true });
208+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
209209
this.grid.parentVirtDir.onChunkLoad
210210
.pipe(first())
211211
.subscribe(() => {
@@ -226,7 +226,7 @@ export class IgxGridNavigationService {
226226
const allCells = rowElement.querySelectorAll(this.getCellSelector(-1, isSummary));
227227
allCells[allCells.length - 1].focus({ preventScroll: true });
228228
} else {
229-
this.grid.nativeElement.focus({ preventScroll: true });
229+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
230230
this.grid.parentVirtDir.onChunkLoad
231231
.pipe(first())
232232
.subscribe(() => {
@@ -245,7 +245,7 @@ export class IgxGridNavigationService {
245245
`${cellSelector}[data-visibleIndex="${visibleColumnIndex}"]`);
246246
cells[0].focus();
247247
} else {
248-
this.grid.nativeElement.focus({ preventScroll: true });
248+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
249249
this.grid.verticalScrollContainer.scrollTo(0);
250250
this.grid.verticalScrollContainer.onChunkLoad
251251
.pipe(first()).subscribe(() => {
@@ -265,7 +265,7 @@ export class IgxGridNavigationService {
265265
`${cellSelector}[data-visibleIndex="${visibleColumnIndex}"]`);
266266
cells[cells.length - 1].focus();
267267
} else {
268-
this.grid.nativeElement.focus({ preventScroll: true });
268+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
269269
this.grid.verticalScrollContainer.scrollTo(this.grid.verticalScrollContainer.igxForOf.length - 1);
270270
this.grid.verticalScrollContainer.onChunkLoad
271271
.pipe(first()).subscribe(() => {
@@ -285,7 +285,7 @@ export class IgxGridNavigationService {
285285
const containerTopOffset = parseInt(this.verticalDisplayContainerElement.style.top, 10);
286286
if (!rowElement.previousElementSibling ||
287287
rowElement.previousElementSibling.offsetTop < Math.abs(containerTopOffset)) {
288-
this.grid.nativeElement.focus({ preventScroll: true });
288+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
289289
this.grid.verticalScrollContainer.scrollTo(currentRowIndex - 1);
290290
this.grid.verticalScrollContainer.onChunkLoad
291291
.pipe(first())
@@ -322,7 +322,7 @@ export class IgxGridNavigationService {
322322
const targetEndTopOffset = rowElement.nextElementSibling ?
323323
rowElement.nextElementSibling.offsetTop + rowHeight + parseInt(this.verticalDisplayContainerElement.style.top, 10) :
324324
containerHeight + rowHeight;
325-
this.grid.nativeElement.focus({ preventScroll: true });
325+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
326326
if (containerHeight && containerHeight < targetEndTopOffset) {
327327
const nextIndex = currentRowIndex + 1;
328328
this.grid.verticalScrollContainer.scrollTo(nextIndex);
@@ -366,7 +366,7 @@ export class IgxGridNavigationService {
366366
if (!horizontalScroll.clientWidth || parseInt(horizontalScroll.scrollLeft, 10) <= 1 || this.grid.pinnedColumns.length) {
367367
this.navigateTop(0);
368368
} else {
369-
this.grid.nativeElement.focus({ preventScroll: true });
369+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
370370
this.horizontalScroll(this.grid.dataRowList.first.index).scrollTo(0);
371371
this.grid.parentVirtDir.onChunkLoad
372372
.pipe(first())
@@ -385,7 +385,7 @@ export class IgxGridNavigationService {
385385
const rowIndex = parseInt(rows[rows.length - 1].getAttribute('data-rowIndex'), 10);
386386
this.onKeydownEnd(rowIndex);
387387
} else {
388-
this.grid.nativeElement.focus({ preventScroll: true });
388+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
389389
this.grid.verticalScrollContainer.scrollTo(this.grid.verticalScrollContainer.igxForOf.length - 1);
390390
this.grid.verticalScrollContainer.onChunkLoad
391391
.pipe(first()).subscribe(() => {
@@ -598,7 +598,7 @@ export class IgxGridNavigationService {
598598
public performHorizontalScrollToCell(
599599
rowIndex: number, visibleColumnIndex: number, isSummary: boolean = false, cb?: () => void) {
600600
const unpinnedIndex = this.getColumnUnpinnedIndex(visibleColumnIndex);
601-
this.grid.nativeElement.focus({ preventScroll: true });
601+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
602602
this.grid.parentVirtDir.onChunkLoad
603603
.pipe(first())
604604
.subscribe(() => {
@@ -614,6 +614,10 @@ export class IgxGridNavigationService {
614614
this.horizontalScroll(rowIndex).scrollTo(unpinnedIndex);
615615
}
616616

617+
protected getFocusableGrid() {
618+
return this.grid;
619+
}
620+
617621
protected getRowByIndex(index, selector = this.getRowSelector()) {
618622
return this.grid.nativeElement.querySelector(
619623
`${selector}[data-rowindex="${index}"]`);

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

Lines changed: 53 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ export class IgxGridComponent extends IgxGridBaseComponent implements IGridDataB
117117
* ```html
118118
* <igx-grid [data]="Data" [autoGenerate]="true"></igx-grid>
119119
* ```
120-
* @memberof IgxGridBaseComponent
120+
* @memberof IgxGridComponent
121121
*/
122122
@Input()
123123
public get data(): any[] {
@@ -163,6 +163,49 @@ export class IgxGridComponent extends IgxGridBaseComponent implements IGridDataB
163163
}
164164
}
165165

166+
/**
167+
* Returns the state of the grid virtualization, including the start index and how many records are rendered.
168+
* ```typescript
169+
* const gridVirtState = this.grid1.virtualizationState;
170+
* ```
171+
* @memberof IgxGridComponent
172+
*/
173+
get virtualizationState() {
174+
return this.verticalScrollContainer.state;
175+
}
176+
177+
/**
178+
* @hidden
179+
*/
180+
set virtualizationState(state) {
181+
this.verticalScrollContainer.state = state;
182+
}
183+
184+
/**
185+
* Sets the total number of records in the data source.
186+
* This property is required for remote grid virtualization to function when it is bound to remote data.
187+
* ```typescript
188+
* this.grid1.totalItemCount = 55;
189+
* ```
190+
* @memberof IgxGridComponent
191+
*/
192+
set totalItemCount(count) {
193+
this.verticalScrollContainer.totalItemCount = count;
194+
this.cdr.detectChanges();
195+
}
196+
197+
/**
198+
* Returns the total number of records in the data source.
199+
* Works only with remote grid virtualization.
200+
* ```typescript
201+
* const itemCount = this.grid1.totalItemCount;
202+
* ```
203+
* @memberof IgxGridComponent
204+
*/
205+
get totalItemCount() {
206+
return this.verticalScrollContainer.totalItemCount;
207+
}
208+
166209
private _gridAPI: IgxGridAPIService;
167210
private _filteredData = null;
168211

@@ -780,6 +823,15 @@ export class IgxGridComponent extends IgxGridBaseComponent implements IGridDataB
780823
}
781824
}
782825

826+
/**
827+
* @hidden
828+
*/
829+
protected get defaultTargetBodyHeight(): number {
830+
const allItems = this.totalItemCount || this.dataLength;
831+
return this.renderedRowHeight * Math.min(this._defaultTargetRecordNumber,
832+
this.paging ? Math.min(allItems, this.perPage) : allItems);
833+
}
834+
783835
/**
784836
* @hidden
785837
*/

‎projects/igniteui-angular/src/lib/grids/grid/grid.multi-row-layout.integration.spec.ts‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1110,6 +1110,42 @@ describe('IgxGrid - multi-row-layout Integration - ', () => {
11101110
expect(groupRowBlocks[0].nativeElement.style.gridTemplateColumns).toEqual('200px 200px 650px 50px 100px 200px');
11111111
});
11121112
});
1113+
1114+
describe('Selection ', () => {
1115+
beforeEach(async(() => {
1116+
fixture = TestBed.createComponent(ColumnLayoutGroupingTestComponent);
1117+
fixture.detectChanges();
1118+
grid = fixture.componentInstance.grid;
1119+
colGroups = fixture.componentInstance.colGroups;
1120+
}));
1121+
1122+
it('should return correct selected data via getSelectedData API.', () => {
1123+
const selectedData1 = [{
1124+
ID: 'ALFKI',
1125+
CompanyName: 'Alfreds Futterkiste',
1126+
ContactName: 'Maria Anders',
1127+
ContactTitle: 'Sales Representative'
1128+
}];
1129+
const selectedData2 = [{
1130+
PostalCode: '05021',
1131+
City: 'México D.F.',
1132+
Country: 'Mexico',
1133+
Address: 'Avda. de la Constitución 2222'
1134+
}];
1135+
let cell = grid.getCellByColumn(0, 'CompanyName');
1136+
UIInteractions.clickElement(cell);
1137+
fixture.detectChanges();
1138+
1139+
expect(grid.getSelectedData()).toEqual(selectedData1);
1140+
1141+
cell = grid.getCellByColumn(1, 'City');
1142+
UIInteractions.clickElement(cell);
1143+
fixture.detectChanges();
1144+
1145+
expect(grid.getSelectedData()).toEqual(selectedData2);
1146+
});
1147+
});
1148+
11131149
});
11141150

11151151
@Component({

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

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { first } from 'rxjs/operators';
44
import { FilterMode } from '../grid-base.component';
55
import { IgxColumnComponent } from '../../grids/column.component';
66
import { ISelectionNode } from '../../core/grid-selection';
7+
import { isIE } from '../../core/utils';
78

89
export class IgxHierarchicalGridNavigationService extends IgxGridNavigationService {
910
public grid: IgxHierarchicalGridComponent;
@@ -174,6 +175,18 @@ export class IgxHierarchicalGridNavigationService extends IgxGridNavigationServi
174175
if (cells.length > 0) { cells[cells.length - 1].focus(); }
175176
});
176177
}
178+
} else if (this.grid.parent !== null) {
179+
const childContainer = this.grid.nativeElement.parentNode.parentNode;
180+
const diff =
181+
childContainer.getBoundingClientRect().bottom - this.grid.rootGrid.tbody.nativeElement.getBoundingClientRect().bottom;
182+
const endIsVisible = diff < 0;
183+
const scrollable = this.getNextScrollableDown(this.grid);
184+
if (!endIsVisible) {
185+
this.scrollGrid(scrollable.grid, diff,
186+
() => super.navigateBottom(visibleColumnIndex));
187+
} else {
188+
super.navigateBottom(visibleColumnIndex);
189+
}
177190
} else {
178191
super.navigateBottom(visibleColumnIndex);
179192
}
@@ -423,6 +436,10 @@ export class IgxHierarchicalGridNavigationService extends IgxGridNavigationServi
423436
}
424437
}
425438

439+
public getFocusableGrid() {
440+
return (isIE() && this.grid.rootGrid) ? this.grid.rootGrid : this.grid;
441+
}
442+
426443
private getLastGridElem(trContainer) {
427444
const children = trContainer.children;
428445
const closestChild = children[children.length - 1].children[0].children[0];
@@ -720,7 +737,7 @@ export class IgxHierarchicalGridNavigationService extends IgxGridNavigationServi
720737
grid.dataRowList.toArray()[0].virtDirRow.scrollTo(unpinnedIndex);
721738
}
722739
private scrollGrid(grid, target, callBackFunc) {
723-
grid.nativeElement.focus({ preventScroll: true });
740+
this.getFocusableGrid().nativeElement.focus({preventScroll: true});
724741
requestAnimationFrame(() => {
725742
if (typeof target === 'number') {
726743
grid.verticalScrollContainer.addScrollTop(target);

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

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -671,6 +671,9 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseCompone
671671

672672
const childGrids = this.getChildGrids(true);
673673
childGrids.forEach((grid) => {
674+
if (grid.isPercentWidth) {
675+
grid.reflow();
676+
}
674677
grid.updateScrollPosition();
675678
});
676679
}

0 commit comments

Comments
 (0)