FlexGrid Custom Footers

This sample shows how to extend FlexGrid to provide two types of footer elements:

  1. Group Footer Rows: When grouping is enabled, FlexGrid adds group rows above each group. This sample shows how you can add custom group rows below each group as well. Group footer rows are implemented using a custom directive called groupFooters which you can add to any FlexGrid.
  2. Footer Grid: In some situations you may want to display a non-scrollable row below the grid to show summary information such as subtotals. This sample shows how you can accomplish this using a separate but synchronized grid with a single row. The grid footer is implemented as a custom directive called gridFooterFor which you can add to a FlexGrid to have it act as a footer for another FlexGrid.

Select how to group the data:


See and edit the data here: