Practicind grouping-grid

[fabio.bozzo]

I'm trying to customize this awesome demo: http://dev.sencha.com/deploy/dev/exa...id/totals.html

That uses static data, I am trying to bind it to a RESTful JsonStore, which works in the restful grid example. My service returns something like that:

{"SUCCESS":true,"MESSAGE":"Ok!","DATA":[{"NUMERO_PEZZI":34,"MEDIA_VENDUTO":374.88,"VALORE_VENDUTO":7122.7,"NUMERO_VENDITE":19,"DATA":"01 dic 2010"},{"NUMERO_PEZZI":36,"MEDIA_VENDUTO":219.41,"VALORE_VENDUTO":5046.5,"NUMERO_VENDITE":23,"DATA":"02 dic 2010"},{"NUMERO_PEZZI":19,"MEDIA_VENDUTO":213.39,"VALORE_VENDUTO":3414.3,"NUMERO_VENDITE":16,"DATA":"03 dic 2010"},{"NUMERO_PEZZI":63,"MEDIA_VENDUTO":309.2,"VALORE_VENDUTO":14532.35,"NUMERO_VENDITE":47,"DATA":"04 dic 2010"},{"NUMERO_PEZZI":53,"MEDIA_VENDUTO":180.61,"VALORE_VENDUTO":7043.91,"NUMERO_VENDITE":39,"DATA":"05 dic 2010"},{"NUMERO_PEZZI":47,"MEDIA_VENDUTO":319.95,"VALORE_VENDUTO":11838.2,"NUMERO_VENDITE":37,"DATA":"06 dic 2010"},{"NUMERO_PEZZI":47,"MEDIA_VENDUTO":309.28,"VALORE_VENDUTO":10206.3,"NUMERO_VENDITE":33,"DATA":"07 dic 2010"},{"NUMERO_PEZZI":97,"MEDIA_VENDUTO":348.92,"VALORE_VENDUTO":23028.72,"NUMERO_VENDITE":66,"DATA":"08 dic 2010"},{"NUMERO_PEZZI":45,"MEDIA_VENDUTO":183.69,"VALORE_VENDUTO":4592.2,"NUMERO_VENDITE":25,"DATA":"09 dic 2010"},{"NUMERO_PEZZI":42,"MEDIA_VENDUTO":220.83,"VALORE_VENDUTO":6404.01,"NUMERO_VENDITE":29,"DATA":"10 dic 2010"},{"NUMERO_PEZZI":73,"MEDIA_VENDUTO":342.23,"VALORE_VENDUTO":17795.91,"NUMERO_VENDITE":52,"DATA":"11 dic 2010"},{"NUMERO_PEZZI":67,"MEDIA_VENDUTO":397.94,"VALORE_VENDUTO":18703.09,"NUMERO_VENDITE":47,"DATA":"12 dic 2010"},{"NUMERO_PEZZI":35,"MEDIA_VENDUTO":316.33,"VALORE_VENDUTO":5693.9,"NUMERO_VENDITE":18,"DATA":"13 dic 2010"},{"NUMERO_PEZZI":31,"MEDIA_VENDUTO":192.26,"VALORE_VENDUTO":5383.4,"NUMERO_VENDITE":28,"DATA":"14 dic 2010"},{"NUMERO_PEZZI":25,"MEDIA_VENDUTO":176.3,"VALORE_VENDUTO":3702.24,"NUMERO_VENDITE":21,"DATA":"15 dic 2010"},{"NUMERO_PEZZI":73,"MEDIA_VENDUTO":324.89,"VALORE_VENDUTO":14620.2,"NUMERO_VENDITE":45,"DATA":"16 dic 2010"},{"NUMERO_PEZZI":60,"MEDIA_VENDUTO":363.74,"VALORE_VENDUTO":14185.99,"NUMERO_VENDITE":39,"DATA":"17 dic 2010"},{"NUMERO_PEZZI":102,"MEDIA_VENDUTO":157.4,"VALORE_VENDUTO":12592.25,"NUMERO_VENDITE":80,"DATA":"18 dic 2010"},{"NUMERO_PEZZI":123,"MEDIA_VENDUTO":221.39,"VALORE_VENDUTO":21917.34,"NUMERO_VENDITE":99,"DATA":"19 dic 2010"},{"NUMERO_PEZZI":62,"MEDIA_VENDUTO":251.4,"VALORE_VENDUTO":11313.11,"NUMERO_VENDITE":45,"DATA":"20 dic 2010"},{"NUMERO_PEZZI":68,"MEDIA_VENDUTO":247.09,"VALORE_VENDUTO":11860.11,"NUMERO_VENDITE":48,"DATA":"21 dic 2010"},{"NUMERO_PEZZI":111,"MEDIA_VENDUTO":263.43,"VALORE_VENDUTO":21074.01,"NUMERO_VENDITE":80,"DATA":"22 dic 2010"},{"NUMERO_PEZZI":97,"MEDIA_VENDUTO":406.4,"VALORE_VENDUTO":28854.31,"NUMERO_VENDITE":71,"DATA":"23 dic 2010"},{"NUMERO_PEZZI":145,"MEDIA_VENDUTO":251.01,"VALORE_VENDUTO":25351.59,"NUMERO_VENDITE":101,"DATA":"24 dic 2010"},{"NUMERO_PEZZI":109,"MEDIA_VENDUTO":128.41,"VALORE_VENDUTO":9887.8,"NUMERO_VENDITE":77,"DATA":"27 dic 2010"},{"NUMERO_PEZZI":53,"MEDIA_VENDUTO":214.2,"VALORE_VENDUTO":7711.11,"NUMERO_VENDITE":36,"DATA":"28 dic 2010"},{"NUMERO_PEZZI":31,"MEDIA_VENDUTO":103.02,"VALORE_VENDUTO":2472.6,"NUMERO_VENDITE":24,"DATA":"29 dic 2010"},{"NUMERO_PEZZI":40,"MEDIA_VENDUTO":177.45,"VALORE_VENDUTO":5678.4,"NUMERO_VENDITE":32,"DATA":"30 dic 2010"},{"NUMERO_PEZZI":35,"MEDIA_VENDUTO":273.96,"VALORE_VENDUTO":7123.0,"NUMERO_VENDITE":26,"DATA":"31 dic 2010"}]}

Ext.onReady(function(){

    Ext.QuickTips.init();

    var xg = Ext.grid;

    var proxy = new Ext.data.HttpProxy({
        url: '/services/sales/2010/12'
    });
    
    var reader = new Ext.data.JsonReader({
        idProperty: 'DATA',
        totalProperty: 'TOTAL',
        successProperty: 'SUCCESS',
        root: 'DATA',
        fields: [
            {name: 'NUMERO_PEZZI', type: 'int'},
            {name: 'NUMERO_VENDITE', type: 'int'},
            {name: 'VALORE_VENDUTO', type: 'float'},
            {name: 'MEDIA_VENDUTO', type: 'float'},
            {name: 'DATA', type: 'date', dateFormat:'d/m/Y'},
            {name: 'MESE', type: 'string'}
        ]

    });

    // utilize custom extension for Group Summary
    var summary = new Ext.ux.grid.GroupSummary();

    var grid = new xg.GridPanel({
        store: new Ext.data.GroupingStore({
            restful: true,
            proxy: proxy,
            reader: reader,
            sortInfo: {field: 'DATA', direction: 'ASC'},
            groupField: 'MESE'
        }),
        columns: [
            {
                id: 'DATA',
                header: 'Numero Articoli',
                width: 80,
                sortable: true,
                dataIndex: 'NUMERO_PEZZI',
                summaryType: 'count',
                hideable: false,
                summaryRenderer: function(v, params, data){ return "Totale:"; }
            },{
                header: 'Mese',
                width: 20,
                sortable: true,
                dataIndex: 'MESE'
            },{
                header: 'Numero Articoli',
                width: 80,
                sortable: true,
                dataIndex: 'NUMERO_PEZZI',
                summaryType: 'sum'
            },{
                header: 'Numero Vendite',
                width: 80,
                sortable: true,
                dataIndex: 'NUMERO_VENDITE',
                summaryType: 'sum'
            },{
                header: 'Ricavato',
                width: 80,
                sortable: true,
                dataIndex: 'VALORE_VENDUTO',
                summaryType: 'sum'
            },{
                header: 'Media ric.',
                width: 80,
                sortable: true,
                dataIndex: 'MEDIA_VENDUTO',
                summaryType: 'sum'
            },
        ],

        view: new Ext.grid.GroupingView({
            forceFit: true,
            showGroupName: false,
            enableNoGroups: false,
            enableGroupingMenu: false,
            hideGroupedColumn: true
        }),

        plugins: summary,

        tbar : [{
            
        }],

        frame: true,
        width: 800,
        height: 600,
        collapsible: true,
        trackMouseOver: false,
        title: 'Vendite per periodo',
        iconCls: 'icon-grid',
        renderTo: 'contentArea'
    });

});

Page loads, grid shows empty and according to firebug, my web service is never called. What happens?

[steve.brownlee]

Something needs to trigger the Data Store to load your data. It doesn't do it automatically.

Look at the load() and doRequest() methods on the HTTPProxy object
http://dev.sencha.com/deploy/dev/doc...data.HttpProxy

[fabio.bozzo]

What a stupid I am. I didn't load the store. Sorry!