Row Grouping

Grouping rows in a table allows the site visitors to quickly and easily see the structure of the shown data.

Feature description

The following examples show some possible results. The grouping is done fully automatic from the table data.

Grouping by a single column

In this table with fictional data, the “Company” column was chosen as a “category”, so that all people belonging to that company are “grouped” under a common sub-heading:

Last NameFirst NameCompanyCountryBirthday
HoustonJordenAdobeCanada05/03/1978
GregoryBrynnAdobeCanada01/13/1994
BanksTravisAdobeItaly05/04/1969
HarrisMerrittAdobeItaly12/29/1989
BookerLoganAppleIndia12/16/1975
ValenzuelaLuneaAppleIndia01/09/1966
MoranAugustAppleUnited States07/04/1986
BuckleyStoneCiscoAustralia09/11/1980
LottLillithCiscoAustralia12/10/1978
BattleWylieCiscoUnited States01/03/1988

Grouping by multiple columns

It is also possible to designate multiple columns to achieve multiple levels of grouping. In this example, the “Country” column was chosen as a second level:

Last NameFirst NameCompanyCountryBirthday
HoustonJordenAdobeCanada05/03/1978
GregoryBrynnAdobeCanada01/13/1994
BanksTravisAdobeItaly05/04/1969
HarrisMerrittAdobeItaly12/29/1989
BookerLoganAppleIndia12/16/1975
ValenzuelaLuneaAppleIndia01/09/1966
MoranAugustAppleUnited States07/04/1986
BuckleyStoneCiscoAustralia09/11/1980
LottLillithCiscoAustralia12/10/1978
BattleWylieCiscoUnited States01/03/1988

Further details

Depending on the specific needs, it might make sense to then hide the columns that were used as categories, to reduce the duplication of shown information. For that, you can e.g. add this to the “Custom Commands” text field on the table’s “Edit” screen:

columnDefs: [
  {
    visible: false,
    targets: [ 3 ],
  },
],Code language: JavaScript (javascript)

where 3 is the index of the column that is to be hidden. Important: The index is the column number minus 1, so the 3 in this example would hide the 4th column.

Usage instructions

To use these features with your tables, activate the “Row Grouping” feature module on the “Modules” screen of TablePress Pro or TablePress Max. Then, configure the desired options in the “Row Grouping” section on the table’s “Edit” screen.

Screenshot of the "Row Grouping" configuration section in the TablePress Premium versions.
The “Row Grouping” configuration section in the TablePress Premium versions.

Configuration parameters

To configure this module’s features, you can also use these configuration parameters in the “TablePress Table” block, the Elementor widget, or in the Shortcode that you are using to embed the table:

ModuleSlugConfiguration parameterNameDescriptionTypeDefault value
Row Groupingdatatables-rowgroupdatatables_rowgroupboolean (true or false)false
Row Groupingdatatables-rowgroupdatatables_rowgroup_datasrcstring1