How to read this json string in Extjs store reader?

Question

I have this json string look like:

[{
        "totalCount" : 134
    }, {
        "items" : [{
                "id" : 1669,
                "check" : false,
                "name" : "1800mm趟门衣柜",
                "part_number" : "DP101669"
            }, {
                "id" : 1670,
                "check" : false,
                "name" : "1800mm趟门衣柜",
                "part_number" : "DP101670"
            }, {
                "id" : 1671,
                "check" : false,
                "name" : "2118mm趟门衣柜",
                "part_number" : "DP101671"
            }, {
                "id" : 1672,
                "check" : false,
                "name" : "2118mm趟门衣柜",
                "part_number" : "DP101672"
            }, {
                "id" : 1673,
                "check" : false,
                "name" : "1800mm趟门衣柜",
                "part_number" : "DP101673"
            }, {
                "id" : 1674,
                "check" : false,
                "name" : "1800mm趟门衣柜",
                "part_number" : "DP101674"
            }, {
                "id" : 1675,
                "check" : false,
                "name" : "1800mm趟门衣柜",
                "part_number" : "DP101675"
            }, {
                "id" : 1676,
                "check" : false,
                "name" : "1800mm趟门衣柜",
                "part_number" : "DP101676"
            }, {
                "id" : 1677,
                "check" : false,
                "name" : "2118mm趟门衣柜",
                "part_number" : "DP101677"
            }, {
                "id" : 1678,
                "check" : false,
                "name" : "2118mm趟门衣柜",
                "part_number" : "DP101678"
            }
        ]
    }
]

and my store look like:

var item_store = Ext.create('Ext.data.Store', {

    model:'ItemModel',
    autoLoad: true,
    pageSize: 5,
    proxy: {
        type: 'ajax',
        reader: {
            type:'json',
            root: 'items',
            totalProperty: 'totalCount'
        },
        url: 'item_access.jsp?fullpage=true&item_cat=167&group_id='+groupId

    }
});

but it cant read the root node for the store ,now my table look like that: only with two blank row, look like are node totalCount and items:

so how should I config the reader to read that string??

that is my grid:

    var itemPanel=Ext.create('Ext.grid.Panel', {

    id: 'item-panel',
    title: '产品',
    store: item_store,
    columns: [
        { header: 'id',  dataIndex: 'id' , flex: 1 },
        { header: 'part_number',  dataIndex: 'part_number' , flex: 2 },
        { header: 'name', dataIndex: 'name', flex: 3 },
        { xtype: 'checkcolumn',header: '可见', dataIndex: 'check' , flex: 2 ,
        listeners:{
                 checkchange: function(col, idx, isChecked) {
                    var view = itemPanel.getView(),
                        record = view.getRecord(view.getNode(idx));
                        postData(record.get('id'),"ITEM",isChecked);

                }
            }
        }

    ],
     region: 'center',
     layout: 'card',

    // paging bar on the bottom
    bbar: Ext.create('Ext.PagingToolbar', {
        store: item_store,
        displayInfo: true,
        displayMsg: 'Displaying topics {0} - {1} of {2}',
        emptyMsg: "No topics to display",
        items:[
            '-', {
            text: 'Show Preview',
            pressed: pluginExpanded,
            enableToggle: true,
            toggleHandler: function(btn, pressed) {
                var preview = Ext.getCmp('gv').getPlugin('preview');
                preview.toggleExpanded(pressed);
            }
        }]
    }),
});

my model:

Ext.define('ItemModel', {
    extend : 'Ext.data.Model',
    idProperty : 'id',
    fields : [{
            name : "name",
            convert : undefined
        }, {
            name : "id",
            type : types.INT
        }, {
            name : "part_number"
        }, {
            name : "check",
            type : types.BOOLEAN
        }

    ]

});

Answer 1

You may change the data structure if possible :

{ "totalCount": 134, "items": [] }

---

Edit

I have setup a quick test using ext-all-debug.js from version 4.2.0.663, the same as in your JsFiddle. At first glance, the problem comes from the line 41343 :

root = Ext.isArray(data) ? data : me.getRoot(data);

At this point getRoot - which refers to the root property somehow - is not called because data is an array. This is not a bug. I rather think that you misuse the JSON reader which is designed to consider an array not as a configuration structure, but as a record list. Sorry for repeating this but you'd better replace the array with an object as mentionned above. If it's not possible you'll have to bring some changes to the framework in order to make it suit your needs.

Answer 2

In the 4.x series you can pass functions for both the root/total:

totalProperty: function(data) {
    return data[0].totalCount
},
root: function(data) {
    return data[1].items
}