JSON Array Store - how to extract

[RajuGuide]

I have a JSON output that comes from a URL which looks like below:

{ about: 'RRDtool xport JSON output', meta: { start: 1348610400, step: 3600, end: 1348610400, legend: [ 'Tx Packets' ] }, data: [ [ 0.0000000000e+00 ], [ 0.0000000000e+00 ], [ 0.0000000000e+00 ], [ 3.1888888889e-01 ], [ 1.8120555556e+01 ], [ 0.0000000000e+00 ], [ 0.0000000000e+00 ]
]}

I would like to get this in a grid and a chart.
I am not sure how to declare the model, store the display the grid.
The issue is primarily because the data comes without name/value pair.
Second questions is how do I extract the legend and use it as a table heading or chart heading?

Please help.
Thanks.

[skirtle]

You should be able to parse that using an Array reader with a single field:

http://docs.sencha.com/ext-js/4-1/#!...a.reader.Array

[RajuGuide]

Ext.define('RRD',{ extend: 'Ext.data.Model',
    fields: [
        {name: 'data', type:'string'}
    ]
});

var myStore = Ext.create('Ext.data.Store', {
    model: 'RRD',
    autoLoad: true,
    proxy: {
        type: 'ajax',
        url: 'php/dumprrd.php',
        reader: { type: 'json', root: 'data', messageProperty: 'about' }
    }
});

var myTable = Ext.create('Ext.grid.Panel', { store: myStore,
    columns: [
        { text : 'Value', flex : 1, sortable : true, dataIndex: 'data' },
    ],
    height: 900,
    width: 300,
    title: 'Data'
});

I tried something like the above, but it doesn't work.

[skirtle]

Please use [CODE] tags when posting code. I've edited your post to make it readable.

It'll parse that data fine if you just switch it to an Array reader. i.e. Change:

type: 'json'

to:

type: 'array'

[RajuGuide]

Thanks I tried the following code.

Ext.onReady(function () {

    Ext.define('RRD',{ extend: 'Ext.data.Model',
        fields: [
            {name: 'data', mapping:1, type:'float'}
        ]
    });
        
    var myStore = Ext.create('Ext.data.ArrayStore', {
        model: 'RRD',
        autoLoad: true,
        proxy: {
            type: 'ajax',
            url: 'php/dumprrd.php',
            reader: { type: 'array', messageProperty: 'about' }
        }
    });
    
    var myTable = Ext.create('Ext.grid.Panel', { store: myStore,
        columns: [
            { text : 'Value', flex : 1, sortable : true, dataIndex: 'data' },
        ],
        height: 900,
        width: 300,
        title: 'Data'
    });
    
    
    var win = Ext.create('Ext.Window', { width: 800,
        height: 600,
        minHeight: 400,
        minWidth: 550,
        hidden: false,
        maximizable: true,
        title: 'RRD Table',
        renderTo: Ext.getBody(),
        layout: 'fit',
        items: [myTable]
    });

});

Please note that my php outputs something like this:

{ about: 'RRDtool xport JSON output', 
  meta: {     start:  1348610400,     step: 3600,     end: 1348610400,     legend: [       'Tx  Packets'           ]      },   
data: [
     [ 0.0000000000e+00 ],     
[ 3.1888888889e-01 ],      
[ 1.8120555556e+01 ],     
[ 0.0000000000e+00 ],     
[  0.0000000000e+00 ]
    ]
}

I get only one row while I expect 5 items.

[skirtle]

Please format your code properly before posting so we can actually read it. I've edited your last post.

In my previous post I suggested changing 1 word. For some reason you've changed a load of other things as well, which is why it still isn't working.

1. You've changed Ext.data.Store to Ext.data.ArrayStore. Change it back.
2. You've added a mapping to the model's field. Get rid of it.
3. You've removed the root property from the reader. Put it back in.

[RajuGuide]

Thanks - that worked.