New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Group Footers

Unit price  
Product IDProduct nameUnit priceUnits in stockTotal Price
 
 Total products: 67 Total price: 2150.31All units in stock: 2652Total : 70977.15
1234567
Page size:
 67 items in 7 pages
Unit price: 26.00
 37Gravad lax26.00 11 286
 Total products: 1 Total price: 26.00All units in stock: 11Total : 286
Unit price: 28.50
 61Sirop d'érable28.50 113 3220.5
 Total products: 1 Total price: 28.50All units in stock: 113Total : 3220.5
Unit price: 30.00
 7Uncle Bob's Organic Dried Pears30.00 15 450
 Total products: 1 Total price: 30.00All units in stock: 15Total : 450
Unit price: 31.00
 10Ikura31.00 31 961
 Total products: 1 Total price: 31.00All units in stock: 31Total : 961
Unit price: 31.23
 26Gumbär Gummibärchen31.23 15 468.45
 Total products: 1 Total price: 31.23All units in stock: 15Total : 468.45
Unit price: 32.00
 32Mascarpone Fabioli32.00 9 288
 Total products: 1 Total price: 32.00All units in stock: 9Total : 288
Unit price: 32.80
 53Perth Pasties32.80 0 0
 Total products: 1 Total price: 32.80All units in stock: 0Total : 0
Unit price: 33.25
 64Wimmers gute Semmelknödel33.25 22 731.5
 Total products: 1 Total price: 33.25All units in stock: 22Total : 731.5
Unit price: 34.00
 60Camembert Pierrot34.00 19 646
 Total products: 1 Total price: 34.00All units in stock: 19Total : 646
Unit price: 34.80
 72Mozzarella di Giovanni34.80 14 487.2
 Total products: 1 Total price: 34.80All units in stock: 14Total : 487.2
  • NoFilter
  • Contains
  • DoesNotContain
  • StartsWith
  • EndsWith
  • EqualTo
  • NotEqualTo
  • GreaterThan
  • LessThan
  • GreaterThanOrEqualTo
  • LessThanOrEqualTo
  • Between
  • NotBetween
  • IsEmpty
  • NotIsEmpty
  • IsNull
  • NotIsNull
  • Custom
  • Demo Configurator

  • Switch group load mode

In addition to displaying summaries/results from aggregates in the group header, RadGrid exposes group footers feature which provides the option to render footer under each group in the grid. The type of this footer item is GridGroupFooterItem. To enable this functionality merely set the ShowGroupFooter property of the respective GridTableView instance to true (its default value is false).

RadGrid also gives you the opportunity to retain the visibility of the group footers when their corresponding group header row is collapsed. In order to switch on this feature, just set the GroupingSettings.RetainGroupFooterVisibilityproperty to true.

The group footers are most commonly used to visualize calculations from aggregate functions within the scope of the current group. Furthermore, with nested groups you will have group footer for each inner group along with one for the main group. Aggregate calculations are supported for GridBoundColumns, GridCalculatedColumns and GridTemplateColumns.

In order to specify how the group aggregates will be evaluated, specify in every GridBoundColumn/GridCalculatedColumn/GridTemplateColumn the Aggregate property which accepts values from the GridAggregateFunction enumeration.

RadGrid will calculate aggregates over the entire data source and will respect the filter expression applied (if present).

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page Language="c#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.GridExamplesCSharp.Functionality.Grouping.GroupFooters.DefaultCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" UpdateInitiatorPanelsOnly="true">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadioButtonList1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadioButtonList1"></telerik:AjaxUpdatedControl>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="chkKeepGroupFootersVisible">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>
                    <telerik:AjaxUpdatedControl ControlID="chkKeepGroupFootersVisible"></telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="RadGrid1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">
    </telerik:RadAjaxLoadingPanel>
    <div class="demo-container no-bg">
        <telerik:RadGrid RenderMode="Lightweight" ShowGroupPanel="true" AutoGenerateColumns="false" ID="RadGrid1"
            DataSourceID="SqlDataSource1" AllowFilteringByColumn="True" AllowSorting="True"
            ShowFooter="True" runat="server" GridLines="None" AllowPaging="true" EnableLinqExpressions="false">
            <PagerStyle Mode="NextPrevAndNumeric"></PagerStyle>
            <MasterTableView ShowGroupFooter="true" AllowMultiColumnSorting="true">
                <Columns>
                    <telerik:GridBoundColumn Aggregate="Count" DataField="ProductID" HeaderText="Product ID"
                        FooterText="Total products: ">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="ProductName" HeaderText="Product name" SortExpression="ProductName"
                        UniqueName="ProductName">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn Aggregate="Sum" DataField="UnitPrice" HeaderText="Unit price"
                        FooterText="Total price: ">
                    </telerik:GridBoundColumn>
                    <telerik:GridTemplateColumn DataField="UnitsInStock" HeaderText="Units in stock"
                        FooterText="All units in stock: " UniqueName="UnitsInStock" Aggregate="Sum"
                        GroupByExpression="UnitsInStock Group By UnitsInStock">
                        <ItemTemplate>
                            <asp:Label ID="lblUnitsInStock" runat="server" Text='<%#Eval("UnitsInStock") %>'>
                            </asp:Label>
                        </ItemTemplate>
                        <EditItemTemplate>
                            <telerik:RadNumericTextBox RenderMode="Lightweight" ID="txtUnitsInStock" runat="server" text='<%#Bind("UnitsInStock") %>'>
                            </telerik:RadNumericTextBox>
                        </EditItemTemplate>
                    </telerik:GridTemplateColumn>
                    <telerik:GridCalculatedColumn HeaderText="Total Price" UniqueName="TotalPrice" DataType="System.Double"
                        DataFields="UnitPrice, UnitsInStock" Expression="{0}*{1}" FooterText="Total : "
                        Aggregate="Sum">
                    </telerik:GridCalculatedColumn>
                </Columns>
                <GroupByExpressions>
                    <telerik:GridGroupByExpression>
                        <GroupByFields>
                            <telerik:GridGroupByField FieldName="UnitPrice"></telerik:GridGroupByField>
                        </GroupByFields>
                        <SelectFields>
                            <telerik:GridGroupByField FieldName="UnitPrice" HeaderText="Unit price"></telerik:GridGroupByField>
                        </SelectFields>
                    </telerik:GridGroupByExpression>
                </GroupByExpressions>
            </MasterTableView>
            <ClientSettings AllowDragToGroup="true">
            </ClientSettings>
            <GroupingSettings ShowUnGroupButton="true"></GroupingSettings>
        </telerik:RadGrid>
    </div>
    <asp:SqlDataSource ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        SelectCommand="SELECT * FROM Products Where UnitPrice > 9.50" runat="server"></asp:SqlDataSource>
    <qsf:ConfiguratorPanel ID="ConfiguratorPanel1" runat="server">
        <Views>
            <qsf:View>
                <qsf:ConfiguratorColumn runat="server" Size="Medium">
                    <ul class="fb-group">
                        <li>
                            <qsf:RadioButtonList AutoPostBack="true" ID="RadioButtonList1" OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged"
                                runat="server" Label="Switch group load mode" RepeatDirection="Horizontal" RepeatLayout="Table">
                                <asp:ListItem Text="Server" Selected="True">
                                </asp:ListItem>
                                <asp:ListItem Text="Client">
                                </asp:ListItem>
                            </qsf:RadioButtonList>
                        </li>
                        <li>
                            <asp:CheckBox ID="chkKeepGroupFootersVisible" AutoPostBack="true" Text="Retain group footers' visibility"
                                OnCheckedChanged="chkKeepGroupFootersVisible_CheckedChanged" runat="server"></asp:CheckBox>
                        </li>
                    </ul>
                </qsf:ConfiguratorColumn>
            </qsf:View>
        </Views>
    </qsf:ConfiguratorPanel>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance