Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(igx-grid): hide igx-column-group when hidden=true is set in the template initially - 17.2.x #14746

Merged
merged 4 commits into from
Sep 20, 2024
Merged

fix(igx-grid): hide igx-column-group when hidden=true is set in the template initially - 17.2.x #14746

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
563d7d3
test(column-group): hidden property set in the template
ddaribo Sep 11, 2024
a84976d
fix(column-group): hide children if parent is hidden initially
ddaribo Sep 11, 2024
6ce6119
Merge branch '17.2.x' into bpachilova/fix-col-group-hidden-initially-…
ddaribo Sep 18, 2024
74fbbe1
Merge branch '17.2.x' into bpachilova/fix-col-group-hidden-initially-…
ddaribo Sep 20, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -285,6 +285,9 @@ export class IgxColumnGroupComponent extends IgxColumnComponent implements After
if (this.pinned) {
child.pinned = this.pinned;
}
if (this._hidden) {
child.hidden = this._hidden;
}
});
if (this.collapsible) {
this.setExpandCollapseState();
Expand Down
20 changes: 18 additions & 2 deletions projects/igniteui-angular/src/lib/grids/grid/column-group.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,8 @@ import { OneGroupOneColGridComponent, OneGroupThreeColsGridComponent,
NestedColGroupsGridComponent, StegosaurusGridComponent,
OneColPerGroupGridComponent, NestedColumnGroupsGridComponent,
DynamicGridComponent, NestedColGroupsWithTemplatesGridComponent,
DynamicColGroupsGridComponent } from '../../test-utils/grid-mch-sample.spec';
DynamicColGroupsGridComponent,
ColumnGroupHiddenInTemplateComponent} from '../../test-utils/grid-mch-sample.spec';
import { CellType } from '../common/grid.interface';

const GRID_COL_THEAD_TITLE_CLASS = 'igx-grid-th__title';
Expand Down Expand Up @@ -47,7 +48,8 @@ describe('IgxGrid - multi-column headers #grid', () => {
NestedColumnGroupsGridComponent,
DynamicGridComponent,
NestedColGroupsWithTemplatesGridComponent,
DynamicColGroupsGridComponent
DynamicColGroupsGridComponent,
ColumnGroupHiddenInTemplateComponent
]
})
.compileComponents();
Expand Down Expand Up @@ -392,6 +394,20 @@ describe('IgxGrid - multi-column headers #grid', () => {
expect(generalHeader.nativeElement.firstElementChild.title).toBe('General Information Title');
expect(addressHeader.nativeElement.firstElementChild.title).toBe('Address Information');
});

it('should hide column group when hidden property is set to true in the template - parent and child level', () => {
fixture = TestBed.createComponent(ColumnGroupHiddenInTemplateComponent);
fixture.detectChanges();

grid = fixture.componentInstance.grid;
const generalGroup = grid.columnList.find(c => c.header === 'General Information');
const locationGroup = grid.columnList.find(c => c.header === 'Location');
expect(generalGroup.hidden).toBe(true);
expect(locationGroup.hidden).toBe(true);

expect(GridFunctions.getColumnHeaders(fixture).length).toEqual(6);
expect(GridFunctions.getColumnGroupHeaders(fixture).length).toEqual(2);
});
});

describe('Columns widths tests (1 group 1 column) ', () => {
Expand Down
33 changes: 33 additions & 0 deletions projects/igniteui-angular/src/lib/test-utils/grid-mch-sample.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -660,3 +660,36 @@ export class NestedColGroupsWithTemplatesGridComponent {

public data = SampleTestData.contactInfoDataFull();
}

@Component({
template: `
<igx-grid #grid [data]="data" height="500px" >
<igx-column field="ID"></igx-column>
<igx-column-group header="General Information" [hidden]="true">
<igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="CompanyName"></igx-column>
<igx-column-group header="Person Details">
<igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="ContactName"></igx-column>
<igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="ContactTitle"></igx-column>
</igx-column-group>
</igx-column-group>
<igx-column-group header="Address Information">
<igx-column-group header="Location" [hidden]="true">
<igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Country"></igx-column>
<igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Region"></igx-column>
</igx-column-group>
<igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="City"></igx-column>
<igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Address"></igx-column>
<igx-column-group header="Contact Information">
<igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Phone"></igx-column>
<igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Fax"></igx-column>
<igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="PostalCode"></igx-column>
</igx-column-group>
</igx-column-group>
<igx-column-group #emptyColGroup header="Empty Header">
</igx-column-group>
</igx-grid>
`,
standalone: true,
imports: [IgxGridComponent, IgxColumnGroupComponent, IgxColumnComponent]
})
export class ColumnGroupHiddenInTemplateComponent extends ColumnGroupTestComponent { }
Loading