Infragistics(R) IgniteUI
igGrid GroupBy Overview
E-mail your feedback on this topic.

Glossary Item Box

Topic Overview

Purpose

This topic introduces the grouping functionality of the igGrid™.

In this topic

This topic contains the following sections:

Introduction

The igGrid supports a column grouping functionality that enables the user to employ the data in one or more columns in a grid as a primary and, respectively, secondary criteria for organizing the records in the group in groups. The picture bellow demonstrate a grid in which the values of the SafetyStockLevel column – 500, 8000, 1,000, etc. – are used to group and arrange the data in the grid, i.e. the grid is grouped by its SafetyStockLevel column. Note tha column that serves as a grouping criterion is taken out of the grid.

Grouping in the igGrid works the same as the analogous functionality in Microsoft® Office Outlook® – you drag a column that you want to group by and drop it into a special grouping area above the grid. This re-arranges the grid with as many groups as distinct value are there in the selected column. In addition, inside the groups, the records are sorted. If you drop additional columns, then, within the already existing groups, further gropings are applied.

You can define your own custom grouping method. For details about custom grouping, refer to the Grid Outllok Group By Overview topic.

Grouping is implemented and managed by the Group By widget.

Grouping Features Overview

The table below briefly explains the grouping main features and the Group By widget properties that manage them.

Note: In the following table, the properties and events specific to the Group By Dialog are not listed. They are available in the Group By Dialog topic.

Feature Description jQuery Property MVC Property
Grouping mode There are several grouping modes supported by the Group By widget. type Type
Column Settings This option allows configuring every column’s group by separately. columnSettings ColumnSettings
Group summaries Group summaries are provide some group-specific information about every group, like the the count of the rows in the group. Group summaries are configured individually for every group. summarySettings SummarySettings
Grouped row text templates

Template for the text of the grouped row. (Follows the jQuery templating guidelines.)

groupedRowTextTemplate

GroupedRowTextTemplate

Client events

The Group By widget has special events that can be handled during its lifecycle. They are events, which are fired when:

the grouping action begins. (This event is cancelable.)

the grouping action ends. This event is fired also when group/ungroup from Group By modal dialog.

groupedColumnsChanging

groupedColumnsChanged

groupedColumnsChanging

groupedColumnsChanged

Appearance Plenty of features that allow you changing the look-and-feel of the group indicators and their text.

groupByAreaVisibility

initialExpand

emptyGroupByAreaContent

expansionIndicatorVisibility

groupByLabelWidth

labelDragHelperOpacity

indentation

expandTooltip

collapseTooltip

removeButtonTooltip

GroupByAreaVisibility

InitialExpand

EmptyGroupByAreaContent

ExpansionIndicatorVisibility

GroupByLabelWidth

LabelDragHelperOpacity

Indentation

ExpandTooltip

CollapseTooltip

RemoveButtonTooltip

For details about the grouping properties, refer to the Grid Outlook Grouped By Properties Reference for jQuery and MVC topic.

Related Topics

Following are some other topics you may find useful.

Grid Outlook Group By Getting Started

Grid Outlook Group By Properties Reference

Grid Known Issues and Breaking Changes