O'Reilly logo

Ext JS 3.0 Cookbook by Jorge Ramon

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Data grouping with live group summaries

Combining a grid component with a GroupingStore and a GroupingView allows you to display records grouped by one of the available fields, and also allows you to create column summaries on the fly.

The Movies By Category grid in this recipe implements data grouping and live group summaries. Each group shows a summary with the number of movies in the group, the average movie length, and price:

Data grouping with live group summaries

With the Group By This Field menu, users can change the way data is grouped, as well as recalculate the summaries accordingly:

How to do it...

  1. Create the data reader:
    var reader = new Ext.data.JsonReader({ idProperty: 'fid', ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required