How to group the list

[Winnie Lam]

In the Kitchen Sink example, list can be grouped by using the "grouped" attribute but in the API, "grouped" is not available for Ext.dataview.List. How to group the list?

Ext.define('App.store.ShopInfos', {
    extend: 'Ext.data.Store',
    requires: 'App.model.ShopInfo',
    model: 'App.model.ShopInfo',
    autoLoad: true,
    sorters: 'NameEn',
    groupField: 'category',
    proxy: {
        type: 'ajax',
        url: 'WebService.asmx/GetShopInfo',
        extraParams: {
            Id: 0
        },
        headers: {'Content-type': 'application/json'},
        method: 'post',
        reader: { 
            root: 'd'
        }
    },
    getGroupString: function (record) {
        return record.get('Category')[0];
    }


});

{ 
                xtype: 'list', 
                id: 'shopinfoList',
                store: 'ShopInfos',
                onItemDisclosure: function (record) {
                },
                itemTpl:    '<div class="list-item-title">{NameEn}</div>' +
                            '<div class="list-item-narrative">{Category}</div>'
                //grouped: true
                //indexBar: true
            }

[mitchellsimoens]

There is an example that comes with the download... in the examples/list/index.html

grouped and indexbar are valid configs... documentation isn't 100%

[Winnie Lam]

But I can't use it in this way...

{                 xtype: 'list', 
                id: 'shopinfoList',
                store: 'ShopInfos',
                mode: 'SINGLE',
                allowDeselect: true,
                disclosure: true,
                grouped: true,
                indexBar: true,
                itemTpl:    '<div class="list-item-title">{Name}</div>' +
                            '<div class="list-item-narrative">{Category}</div>'
                //grouped: true
                //indexBar: true
            }