Reading JSON dynamic array

[locutusUT]

I'm attempting to read from a JSON response that can be dynamic (facets based on the search I perform). Here's a sample of what the root looks like but the number of values in each array can be dynamic but will always repeat as name/number:

"facet_counts":{
 "facet_queries":{},
 "facet_fields":{
    "deviceName":[
     "x2",6,
     "dd22",12,
     "f12",1],
    "devicePrgMgr":[
     "alberto",80,
     "anando",24,
     "artus",101],
    "portfolioName":[
     "zztop",32],
    "chipsetName":[
     "fat",3,
     "thin",2],
...

What I am unsure of is the best way to do this given the dynamic nature and the structure of the JSON.

I'm still a bit new to ExtJS, so if there are some pointers to efficiently managing the JSON above, it would be appreciated. I haven't found a whole lot online given this example.

TIA!

[VinylFox]

It really depends on how you want to use the data, for instance, do you need this data in a store? Is there some HTML output you need to create from this? etc.

[locutusUT]

I would like to use the data in a left hand NAV (maybe a data panel) where I could load the key/value pairs of by category. Something like:

Devices
---X2 (6)
---DD22 (12)
---F12 (1)
Program Manager
---Alberto (80)
---Anando (24)
---Artus (101)
... and so on...

See how the JSON response is structured, I'm not really sure how to load this using JsonReader or ArrayReader. Any suggestions?

TIA!

[locutusUT]

So I tried to do the code below, but I get "r is undefined" in the ext-all-debug.js code. Note that I'm trying to use another JsonReader on a different node to read the facet data although I'm not exactly sure what to make of the array that is the value for device name so I just planned to decode the result first to see what's in there. However, I ran into this error.

    var ds = new Ext.data.GroupingStore({
        proxy: new Ext.data.ScriptTagProxy({
            url: 'http://solrdev:8800/solr/select/?',
            method: 'GET',
            callbackParam:'json.wrf'
        }),
        reader: new Ext.data.JsonReader({
            id:   'id',
            totalProperty: 'response.numFound',
            root: 'response.docs'
        }, Ext.data.Record.create([
            {
                name: 'id',
                mapping: 'id'
            },
            {
                name:'portfolioName',
                mapping: 'portfolioName'
            },
            {
                name:'chipsetName',
                mapping: 'chipsetName'
            }
        ])),
        paramNames: {limit:'rows'},
        sortInfo: {field: 'coreName', direction: 'asc'},
        remoteSort: true,
        baseParams: {version:'2.2',indent:'on',start:cursor,rows:pageSize,qt:'dismax',wt:'json'}
    });
    var facets = Ext.data.Record.create([
        {name:'deviceName',mapping:'deviceName'}
    ]);
    var deviceFacets = new Ext.data.Store({
        reader: new Ext.data.JsonReader({
            root:'facet_counts.facet_fields'
        }, facets)
    });
    ds.on('load', function(store){
        var response = deviceFacets.loadData(store.reader.jsonData);
        var obj = Ext.util.JSON.decode(response.responseText);
        console.log(deviceFacets.query('deviceName'));
    });

[VinylFox]

I would consider using an XTemplate to render your data into a panel's body. Just use a simple Ajax request to get your data, and create a template that the data can be applied to.

[locutusUT]

Sure that sounds reasonable, once I finally have the data in a construct that is useful. My question is more around how do I read the JSON arrays to take the pairs of data and put them into a map.

I tried experimenting a bit with convert, but the problem with that is I can't pass the ordinal position of the array to say which count lines up with which facet element (facet_element_position + 1 in my case) and it reads every array element, so it will read every facet element and then the count whereas I need it to read both as one unit (e.g., "X2", 6).

Here's the convert function I was toying around with:

    
    var facets = Ext.data.Record.create([
        {name:'deviceName', convert:getFacetValue},
        {name:'count', mapping:1} //doesn't read the count value it reads the second letter in the first array
    ]);
    var deviceFacets = new Ext.data.Store({
        reader: new Ext.data.ArrayReader({
            root:'deviceName'
        }, facets)
    });
    function getFacetValue(v, record) {
        var myMap = {};
        var countField = deviceFacets.reader.arrayData.deviceName;
        myMap[record] = countField[getFacetValue.count];
        return record;
    }

[locutusUT]

Resolved!

I actually fixed the source JSON to be arrays so the ArrayReader could pick up without any special modifications. Thanks!

[delvia_bles]

Hi want to read Json data in data store and json is generating dynamically. I want to feed that json to line chart and i am facing following problem in code :

handler:

function(){
var fields = cpuStore.reader.fields;//this.store.reader.meta.fields;//

cpuChart =

new Ext.chart.LineChart();//this.items.items[0];

var series = [];
for(var i=1;i<fields.length;i++){
// console.log(i);

var newSeries = new Ext.chart.LineSeries({
type: 'line',
displayName: fields[i].name,
yField: fields[i].name,
style: {
mode: 'stretch',
color: this.chartColors[i+1]
}
});
series.push(newSeries);
}
cpuChart.series = series;

}

this function i have written on button click and i am getting error that fields is undefined in for loop. Plz help me out!