Version

Summary Row

The Summary Row feature of WebDataGrid™ is available in WebHierarchicalDataGrid™. The behavior allows adding standard summaries (Count; Sum; Average; Min; Max) as well as custom ones.

Each band in WebHierarchicalDataGrid can be assigned a Summary Row behavior. You can set the EnableInheritance property of a band to enable child bands to inherit the setting. This allows you to customize summary row behavior in each band of data. For example, if you want summaries for all bands in WebHierarchicalDataGrid, just enable the SummaryRow behavior at the root level and set EnableInheritance to True. If you want to disable the behavior for a specific child band, disable the behavior for that specific band.

When enabled, the behavior adds a summary button to each header. When the button is pressed, a drop-down with available summaries appears.

WebHierarchicalDataGrid About Summary Row 01.png
Note
Note:

The standard summaries are available for numeric data only. An exception is Count summary type, which is always available.

Enabling Summary Row

In order to enable summaries for WebHierarchicalDataGrid and allow end-users to add summaries for a column you can follow these steps.

  1. Bind WebHierarchicalDataGrid to a WebHierarchicalDataSource component retrieving data from the Products and Orders tables of Northwind. For more information on doing this, see Binding WebHierarchicalDataGrid to a WebHierarchicalDataSource.

  2. In the Microsoft® Visual Studio™ property window, locate the Behaviors property and click the ellipsis (…​) button to launch the Behaviors Editor Dialog.

  3. Check the Summary Row behavior and set Enable and EnableInheritance to True.

  4. Add an Average summary for the Products band (UnitPrice column).

    1. Locate the ColumnSummaries property and click the ellipsis (…​) button to launch the ColumnSummaryInfo Dialog.

    2. Add a Column Summary by clicking the Add Item Button.

    3. Set the summary’s ColumnKey property to UnitPrice.

    4. Locate the Summaries property and click the ellipsis (…​) button to launch the the Summary Collection Editor Dialog.

    5. Set the SummaryType property to Average.

    6. Click Apply then OK to close the Summary Collection Editor Dialog, and do the same to close ColumnSummaryInfo Dialog.

    7. Click Apply then OK to close the Behaviors Editor Dialog.

  1. Add a Sum summary for the child Orders band (Quantity column).

    1. Locate the Band property and click the ellipsis (…) button. The Edit Bands dialog displays.

    2. Add a child band to the root band by clicking the Add Child button.

    3. Change the Key to Orders.

    4. Set DataMember to AccessDataSource2_Orders.

    5. Set DataKeyFields to OrderID.

    6. Click the ellipsis (…) button for the Behaviors property.

    7. Check the checkbox for the Summary Row behavior.

    8. Click the ellipsis (…) button for the ColumnSummaries property.

    9. Add a column summary as you did at the previous step; this time set the ColumnKey to Quantity and the SummaryType to Sum.

    10. Click OK to close the Edit Behaviors dialog.

    11. Click Apply then OK to close the Behaviors Editor Dialog.

You can also do the above steps using the code below.

In HTML:

<ig:WebHierarchicalDataGrid ID="WebHierarchicalDataGrid1" runat="server" DataSourceID="WebHierarchicalDataSource1"
            Height="400px" Width="750px" DataKeyFields="ProductID">
            <Bands>
                <ig:Band Height="100" DataMember="AccessDataSource1_Orders" DataKeyFields="OrderID">
                    <Behaviors>
                        <ig:SummaryRow>
                            <ColumnSummaries>
                                <ig:ColumnSummaryInfo ColumnKey="Quantity">
                                    <Summaries>
                                        <ig:Summary SummaryType="Sum"></ig:Summary>
                                    </Summaries>
                                </ig:ColumnSummaryInfo>
                            </ColumnSummaries>
                        </ig:SummaryRow>
                    </Behaviors>
                </ig:Band>
            </Bands>
            <Behaviors>
                <ig:SummaryRow EnableInheritance="true">
                    <ColumnSummaries>
                        <ig:ColumnSummaryInfo ColumnKey="UnitPrice">
                            <Summaries>
                                <ig:Summary SummaryType="Average"></ig:Summary>
                            </Summaries>
                        </ig:ColumnSummaryInfo>
                    </ColumnSummaries>
                </ig:SummaryRow>
            </Behaviors>
        </ig:WebHierarchicalDataGrid>

In C#:

protected void WebHierarchicalDataGrid1_InitializeBand(object sender, BandEventArgs e)
{
    if (e.Band.Key == "Products")
    {
        e.Band.Behaviors.CreateBehavior<SummaryRow>();
        e.Band.Behaviors.SummaryRow.EnableInheritance = true;
        ColumnSummaryInfo unitPriceSummary = new ColumnSummaryInfo();
        unitPriceSummary.ColumnKey = "UnitPrice";
        unitPriceSummary.Summaries.Add(SummaryType.Average);
        e.Band.Behaviors.SummaryRow.ColumnSummaries.Add(unitPriceSummary);
        this.WebHierarchicalDataGrid1.RefreshBehaviors();
    }
    else if (e.Band.Key == "Orders")
    {
        e.Band.Behaviors.CreateBehavior<SummaryRow>();
        e.Band.Behaviors.SummaryRow.EnableInheritance = true;
        ColumnSummaryInfo quantitySummary = new ColumnSummaryInfo();
        quantitySummary.ColumnKey = "Quantity";
        quantitySummary.Summaries.Add(SummaryType.Sum);
        quantitySummary.Summaries.Add(SummaryType.Max);
        e.Band.Behaviors.SummaryRow.ColumnSummaries.Add(quantitySummary);
        this.WebHierarchicalDataGrid1.RefreshBehaviors();
    }
}
  1. Run the application. WebHierarchicalDataGrid displays Average summary for the UnitPrice column and Sum summary for the child band’s Quantity column. You can add additional summaries by clicking the summary button at the header of the columns and choosing a summary type from the drop-down options.