How do I Make the first row group fixed in the igx tree grid and exclude it from sorting

385

Manikanta Vundavalli posted over 3 years ago

Hi,

I have a scenario where I have to display a row group all time at the top of list as fixed in the tree grid and should exclude it from sorting the list of row groups as it always have to stay on top.

can you help me with this?

Thanks,

Mani

Parents

2680

Offline Bozhidara Pachilova posted over 3 years ago
Hello Mani,

Thank you for posting to Infragistics Community.

I have been looking into your question and created a small sample with an IgxTreeGrid demonstrating row pinning and sortable columns. You can find it here.

To start with, you can enable row pinning by initializing an IgxActionStrip component in the context of Tree Grid, for example:

<igx-action-strip #actionStrip> <igx-grid-pinning-actions></igx-grid-pinning-actions> </igx-action-strip>

You could read all about the row pinning functionality in its dedicated documentation topic here.

In the sample, you can observe how the tree grid behaves upon sorting when there are some pinned rows. The pinned rows are affected by the sorting, however they remain fixed on their position and are only sorted between them. This is the tree grid’s default behavior and it seems to correspond with your requirement.

In case of any other questions, please do not hesitate to ask.

Sincerely,
Bozhidara Pachilova
Associate Software Developer
Cancel
Reply

Cancel
385

Offline Manikanta Vundavalli posted over 3 years ago in reply to Bozhidara Pachilova

Thank you for the response.

From the sample, I can see only one row is getting pinned in a grouped row.

I want the entire group to be prevented from sorting and is there any way to achieve my functionality without using the action strip module.

I want the first-row group to be pinned on the load itself without using an action strip.

Thanks,

Mani
Cancel
Reply

Cancel

Reply

2680

Offline Bozhidara Pachilova posted over 3 years ago in reply to Manikanta Vundavalli
Hello Mani,

Yes, programmatically setting pinned rows on load is possible without using the action strip with the help of the IgxGridBaseDirective’s pinRow method, where rowID is the primary key. If a primary key is not specified, then the whole data record will be treated as rowID:

this.treeGrid.pinRow(rowID);

Please, note that the Tree Grid Row Pinning functionality pins a single row to the top/bottom. If you are referring to a row and its children as a “row group”, then I suppose you mean pinning a row and its child hierarchy at the same time. This can be achieved with a recursive method, which checks whether the current row has children (this method will depend on the data source, for the purposes of the example it has a flat structure):

public ngOnInit(): void { this.data = generateEmployeeFlatData(); this.pinRowAndAllChildren(this.data, this.data[0].ID); } private pinRowAndAllChildren(data: any, rowID: any) { let hasChildren = this.data.findIndex(item => item.ParentID === rowID); this.treeGrid.pinRow(rowID); if (hasChildren !== -1) { this.data .filter(item => item.ParentID === rowID) .forEach(item => { this.pinRowAndAllChildren(this.data, item.ID); }); } }

With this approach the first row’s children will also be pinned. However, I am under the impression that your requirement is rather to have the pinned rows remain as a hierarchy – to be able to expand the first row to access its children, to expand these children and so on. Currently, the tree grid does not support such behavior and the pinned rows are not visualized as a hierarchy, because you can have pinned rows, whose parents or children are not pinned. Nevertheless, the rows are still connected to the “original ones” within the scrollable area. Features, such as Row Selection, work entirely with row Ids, and selecting pinned rows selects their “original” copies as well (and vise versa). All information regarding row pinning can be found in our documentation here

Please, test the modified sample here and if you require any further assistance on the matter, please let me know.

Best regards,
Bozhidara Pachilova
Associate Software Developer
Cancel
Reply

Cancel

Children

No Data