docs/guides/data/examples/sorting_grouping_filtering_store/app.js

   1 /**
   2  * @example Sorting Grouping Filtering Store
   3  *
   4  * This example demonstrates {@link Ext.data.Store}'s sorting, grouping, and filtering capabilities.
   5  * The data at url `data/users.json` is auto-loaded into the store.  The data will be sorted first by name then id;
   6  * it will be filtered to only include Users with the name 'Ed' and the data will be grouped by age.
   7  * A global variable called "userStore" is created which is an instance of {@link Ext.data.Store}.
   8  * Feel free to experiment with the "userStore" object on the console command line.
   9  * `userStore.getGroups()` should return an array of groups.
  10  */
  11 Ext.define('User', {
  12     extend: 'Ext.data.Model',
  13     fields: [
  14         {name: 'id', type: 'int'},
  15         {name: 'name', type: 'string'}
  16     ]
  17 });
  18
  19 var userStore;
  20 Ext.require('Ext.data.Store');
  21 Ext.onReady(function() {
  22     userStore = Ext.create('Ext.data.Store', {
  23         model: 'User',
  24         autoLoad: true,
  25
  26         sorters: ['name', 'id'], // sort first by name, then by id
  27         filters: {
  28             // filter the data to only include users with the name 'Ed'
  29             property: 'name',
  30             value: 'Ed'
  31         },
  32         groupers: {
  33             // group the users by age in ascending order
  34             property: 'age',
  35             direction: 'ASC'
  36         },
  37
  38         proxy: {
  39             type: 'ajax',
  40             url: 'data/users.json',
  41             reader: {
  42                 type: 'json',
  43                 root: 'users',
  44                 successProperty: 'success'
  45             }
  46         }
  47     });
  48 });
  49