Customizing the Group CellsPremium
The cells group property provides the option to customize the group header, group footer, and data cells of each group.
Start Free Trial
In the following example, the group header is handled by GroupMyHeaderCustomCell, the data cells within the group use GroupMyDataCustomCell, and the group footer is represented by GroupMyFooterCustomCell.
Locked Groups and Columns
When having locked groups (using the lockGroups prop) or locked columns (using the locked prop), additional styles will be added to the td element that lock it into position. However, if you are setting additional styles to the td element, these styles will be overridden. Therefore, these should be passed to the rendered td element.
In addition, when having locked groups and columns, it is also required to render an additional td element td2 which is required in this scenario like demonstrated in the example below.