JSON数据不显示在具有多个容器的面板上

Question

我试图在我的js文件中显示这些数据但是当我尝试加载页面时，数据将不会显示。我做对了吗？

JSON DATA：

{
  "data": {
    "batnbr":"1",
    "tranid":"100001",
    "trandate":"2013-01-20",
    "trantype":"A",
    "docstatus":"A",
    "particulars":"test",
    "coid":"test",
    "brid":"test",
    "cur":"test",
    "exchangerate":"1.0000",
    "doctype":"A",
    "oktopost":"0",
    "posted":"0",
    "seqid":"1",
    "jvdtl":[
      {
        "batnbr":"1",
        "tranid":"100001",
        "account":"test",
        "subaccount":"test",
        "linkto":"1",
        "projectid":"test",
        "budgetid":"test",
        "importid":"test",
        "particulars":"test",
        "dramt":"1000.00",
        "cramt":"1000.00",
        "postref":"test",
        "postrefid":"test",
        "subledger":"test",
        "lineseqid":"1",
        "seqid":"1"
      },{
        "batnbr":"1",
        "tranid":"100001",
        "account":"test2",
        "subaccount":"test2",
        "linkto":"1",
        "projectid":"test",
        "budgetid":"test",
        "importid":"test",
        "particulars":"test",
        "dramt":"2000.00",
        "cramt":"2000.00",
        "postref":"test",
        "postrefid":"test",
        "subledger":"test",
        "lineseqid":"2",
        "seqid":"2"
      },{
        "batnbr":"1",
        "tranid":"100001",
        "account":"test3",
        "subaccount":"test3",
        "linkto":"1",
        "projectid":"test",
        "budgetid":"test",
        "importid":"test",
        "particulars":"test",
        "dramt":"3000.00",
        "cramt":"3000.00",
        "postref":"test",
        "postrefid":"test",
        "subledger":"test",
        "lineseqid":"3",
        "seqid":"3"
      }
    ]
  }
}

商店获得标题

store_jvhdr = new Ext.data.JsonStore({
        model: 'Jvhdr',
        proxy: {
            type: 'ajax',
            url : './journalservlet?batNbr='+val.data.batnbr+'&operation=GET_RECORD',
            reader: {
                type: 'json',
                root: 'data'
            }
        },
        autoLoad: true
        });

存储获取详细信息

store_jvdtl = new Ext.data.JsonStore({
        model: 'Jvdtl',
        proxy: {
            type: 'ajax',
            url : './journalservlet?batNbr='+val.data.batnbr+'&operation=GET_RECORD',
            reader: {
                type: 'json',
                root: 'jvdtl'
            }
        },
        autoLoad: true
        });

模型

Ext.define('Jvhdr',{
extend: 'Ext.data.Model',
fields: [
    {name: 'batnbr', type: 'int'},
    ...
]
});

Ext.define('Jvdtl',{
extend: 'Ext.data.Model',
fields: [
    {name: 'batnbr', type: 'int'},
    ...
]
});

PANEL

....
xtype: 'container',
                border: false,
                layout: 'vbox',
                items: [{
                    xtype: 'container',
                    border: true,
                    flex: 1,
                    layout: {
                        type: 'hbox',
                        align: 'stretch'
                    },
                    store: store_jvhdr,
                    items: [{
                        xtype: 'container',
                        border: true,
                        layout: 'vbox',
                        pack : 'start',
                        padding: '0, 20, 10, 10',
                        items: [
                          {
                          fieldLabel: 'Tran ID',
                          afterLabelTextTpl: required,
                          allowBlank: false,
                          labelWidth: 100,
                          dataIndex: 'tranid',
                          name: 'tranid',
                          xtype: 'textfield'
                          }
                          .....
                        }]
                    },{
                        xtype: 'container',
                        border: true,
                        layout: 'vbox',
                        padding: '0, 0, 10, 0',
                        flex: 1,
                        items: [{
                          fieldLabel: 'DocStatus',
                          afterLabelTextTpl: required,
                          labelWidth: 100,
                          allowBlank: false,
                          dataIndex: 'docstatus',
                          name: 'docstatus',
                          xtype: 'textfield',
                          anchor: '100%'
                        }
                         ...
                        {
                          fieldLabel: 'DocType',
                          afterLabelTextTpl: required,
                          labelWidth: 100,
                          allowBlank: false,
                          dataIndex: 'doctype',
                          name: 'doctype',
                          xtype: 'textfield',
                          anchor: '100%'
                        }
                        ]
                    }]
                },{
                    xtype: 'container',
                    layout: 'anchor',
                    items: [{
                      xtype: 'grid',
                      store: store_jvdtl,
                      columns: [
                        new Ext.grid.RowNumberer(),
                        {
                            text: "BatNbr",
                            hidden: true,
                            dataIndex: 'batnbr'
                        },{
                            text: "TranID",
                            hidden: true,
                            dataIndex: 'tranid'
                        }
                          ....
                       ]
                    }]
                }]
            }]

 ....

顺便说一句，我正在使用不同的容器来布局我的面板。