Skip to content

Commit 7d2e5bc

Browse files
3phase3phase
committed
Changes data of plain hgrid sample
1 parent f8d3186 commit 7d2e5bc

3 files changed

Lines changed: 39 additions & 30 deletions

File tree

‎live-editing/configs/HierarchicalGridConfigGenerator.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -938,8 +938,7 @@ export class HierarchicalGridConfigGenerator implements IConfigGenerator {
938938
component: 'HierarchicalGridValidatorServiceComponent',
939939
additionalFiles: [
940940
'/src/app/directives/prevent-scroll.directive.ts',
941-
'/src/app/data/singersData.ts',
942-
'/src/app/hierarchical-grid/models.ts'
941+
'/src/app/data/hierarchical-data.ts'
943942
],
944943
appModuleConfig: new AppModuleConfig({
945944
imports: ['HierarchicalGridValidatorServiceComponent', 'IgxHierarchicalGridModule', 'IgxPreventDocumentScrollModule'],

‎src/app/hierarchical-grid/hierarchical-grid-validator-service/hierarchical-grid-validator-service.component.html‎

Lines changed: 27 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,38 @@
11
<div class="top-row">
22
<igx-switch [(ngModel)]="rowEdit">Row edit</igx-switch>
33
</div>
4+
45
<div class="grid-wrapper">
5-
<igx-hierarchical-grid igxPreventDocumentScroll #hierarchicalGrid [batchEditing]="true" class="hgrid" [data]="data"
6-
[primaryKey]="'Artist'" [height]="'550px'" [width]="'100%'" [rowEditable]="rowEdit">
7-
<igx-column field="Artist" header="Artist" [editable]="false" [dataType]="'string'"></igx-column>
8-
<igx-column field="HasGrammyAward" header="Has Grammy Award?" [editable]="true" [dataType]="'boolean'">
6+
<igx-hierarchical-grid #hierarchicalGrid height="570px" width="100%" [primaryKey]="'CustomerID'"
7+
[batchEditing]="true" [rowEditable]="true" [rowEditable]="rowEdit">
8+
<igx-column field="CustomerID" [editable]="true"></igx-column>
9+
<igx-column field="CompanyName" [editable]="true" required></igx-column>
10+
<igx-column field="ContactName" [editable]="true" required>
911
</igx-column>
10-
<igx-column field="Debut" header="Debut" [editable]="true" dataType="number" [formatter]="formatter" required>
11-
</igx-column>
12-
<igx-column field="GrammyNominations" header="Grammy Nominations" [editable]="true" dataType="number" required
13-
min="0">
14-
</igx-column>
15-
<igx-column field="GrammyAwards" header="Grammy Awards" [editable]="true" dataType="number" required min="0">
16-
</igx-column>
17-
<igx-row-island [height]="null" #childGrid [key]="'Albums'" [primaryKey]="'Album'" [rowEditable]="true">
18-
<igx-column field="Album" [editable]="false" [dataType]="'string'"></igx-column>
19-
<igx-column field="LaunchDate" header="Launch Date" [editable]="true" [dataType]="'date'" required>
12+
<igx-column field="ContactTitle" [editable]="true" required></igx-column>
13+
<igx-column field="Phone" [editable]="true" required></igx-column>
14+
<igx-column field="Fax" [editable]="true"></igx-column>
15+
16+
<igx-row-island [height]="null" [key]="'Orders'" [primaryKey]="'OrderID'" [autoGenerate]="false"
17+
[batchEditing]="true" [rowEditable]="true" [rowEditable]="rowEdit">
18+
<igx-column [editable]="false" field="OrderID"></igx-column>
19+
<igx-column [editable]="true" field="EmployeeID" [editable]="true" required></igx-column>
20+
<igx-column [editable]="true" field="OrderDate" [dataType]="'date'" [editable]="true" required>
2021
</igx-column>
21-
<igx-column field="BillboardReview" header="Billboard Review" [editable]="true" dataType="number" min="1">
22+
<igx-column [editable]="true" field="RequiredDate" [dataType]="'date'" [editable]="true" required>
2223
</igx-column>
23-
<igx-column field="USBillboard200" header="US Billboard 200" [editable]="true" dataType="number" min="1">
24+
<igx-column field="ShippedDate" [dataType]="'date'" [editable]="true">
2425
</igx-column>
26+
<igx-column field="ShipVia" [selectable]="false" [editable]="true" min="0" max="10"></igx-column>
27+
<igx-column field="Freight" [selectable]="false" [editable]="true"></igx-column>
28+
29+
<igx-row-island [height]="null" [key]="'OrderDetails'" [primaryKey]="'ProductID'" [autoGenerate]="false"
30+
[batchEditing]="true" [rowEditable]="true" [primaryKey]="'ProductID'" [rowEditable]="rowEdit">
31+
<igx-column [editable]="true" field="ProductID" [editable]="false" required></igx-column>
32+
<igx-column [editable]="true" field="UnitPrice" [editable]="true" required></igx-column>
33+
<igx-column [editable]="true" field="Quantity" [editable]="true" required></igx-column>
34+
<igx-column [editable]="true" field="Discount" [editable]="true"></igx-column>
35+
</igx-row-island>
2536
</igx-row-island>
2637
</igx-hierarchical-grid>
2738
</div>

‎src/app/hierarchical-grid/hierarchical-grid-validator-service/hierarchical-grid-validator-service.component.ts‎

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,29 @@
11
import { Component, OnInit, ViewChild } from '@angular/core';
2-
import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular';
3-
import { SINGERS } from '../../data/singersData';
4-
import { Singer } from '../models';
2+
import { IgxHierarchicalGridComponent } from 'igniteui-angular';
3+
import { CUSTOMERS } from '../../data/hierarchical-data';
54

65
@Component({
76
selector: 'app-hierarchical-grid-validator-service',
87
styleUrls: ['./hierarchical-grid-validator-service.component.scss'],
98
templateUrl: './hierarchical-grid-validator-service.component.html'
109
})
1110
export class HierarchicalGridValidatorServiceComponent implements OnInit {
12-
@ViewChild('childGrid', { static: true })
13-
private childGrid: IgxRowIslandComponent;
1411

1512
@ViewChild('hierarchicalGrid', { static: true })
1613
private hierarchicalGrid: IgxHierarchicalGridComponent;
1714

18-
public data: Singer[];
19-
2015
public rowEdit: boolean = false;
2116

22-
constructor() { }
23-
2417
public ngOnInit(): void {
25-
this.data = SINGERS;
18+
this.hierarchicalGrid.data = CUSTOMERS;
19+
for (const item of this.hierarchicalGrid.data) {
20+
const names = item.CompanyName.split(' ');
21+
item.FirstName = names[0];
22+
item.LastName = names[names.length - 1];
23+
item.FullAddress = `${item.Address}, ${item.City}, ${item.Country}`;
24+
item.PersonelDetails = `${item.ContactTitle}: ${item.ContactName}`;
25+
item.CompanysAnnualProfit = (100000 + (Math.random() * Math.floor(1000000))).toFixed(0);
26+
}
2627
}
2728

28-
public formatter = a => a;
29-
3029
}

0 commit comments

Comments
 (0)