Sorting in a grid panel


While grid allows us to make one or more columns sortable (through the sortable configuration of Ext.grid.ColumnModel class). However, it just performs client side sorting in ascending or descending order. It does not perform sorting with respect to values in some other column. For example if I want to sort on prices of the articles in the same brand then simple grid sorting does not allow you to achieve that grouping. This is where ExtJS provides you GroupingStore, which enables you to view related items together and view them shorted as well!

The Class Ext.data.GroupingStore is similar to normal store, except that it provides few additional configurations:
groupField — The field name by which to sort the store’s data
groupOnSort — True to sort the data on the grouping field when a grouping operation occurs, false to sort based on the existing sort info

The GroupingStore is often used in conjunction with an Ext.grid.GroupingView to provide the data model for a grouped GridPanel. All you need to do is to define following configuration in GridPanel:
view: new Ext.grid.GroupingView()

Ext.grid.GroupingView is extended from Ext.grid.GridView and it allows you to minimize maximize all the items in a group within the grid panel. On top of this, if you add the usual components like tool bar (with your buttons of choices) and paging bar and check boxes and you have such a rich interface. ExtJS you beauty!

Tagged with: , ,
Posted in Sencha ExtJS

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

We Have Moved Our Blog!

We have moved our blog to our company site. Check out https://walkingtree.tech/index.php/blog for all latest blogs.

Sencha Select Partner Sencha Training Partner
Xamarin Authorized Partner
Do More. With Sencha.

Recent Publication
%d bloggers like this: