在extjs 4.0中将json存储加载到表单时出现问题

在extjs 4.0中将json存储加载到表单时出现问题,extjs,Extjs,我有以下代码。我正在尝试通过json创建存储。我可以看到firebug调用json,但这些数据没有加载表单。这将使用模型的本地实例。因此,我相信包含“formJobSummary”的小组正在工作。问题出在商店的某个地方 Ext.define('user', { extend: 'Ext.data.Model' fields: ['quotedPrice'] }); var store = Ext.create('Ext.data.Store', { model: 'us

我有以下代码。我正在尝试通过json创建存储。我可以看到firebug调用json,但这些数据没有加载表单。这将使用模型的本地实例。因此,我相信包含“formJobSummary”的小组正在工作。问题出在商店的某个地方

Ext.define('user', {
    extend: 'Ext.data.Model'
    fields: ['quotedPrice']
});

var store = Ext.create('Ext.data.Store', {
    model: 'user',
    proxy: {
        type: 'ajax',
        url: '/data/users.js',
        reader: {
            type: 'json',
            root: 'user'
        }
    },
    autoLoad: true
});


Ext.define('MyApp.view.MyPanel', {
    extend: 'MyApp.view.ui.MyPanel',
    initComponent: function () {
        var me = this;
        me.callParent(arguments);
        var form = Ext.getCmp('formJobSummary'); 
        form.loadRecord(store);
    }
});
Json'/data/users.js'

{
    "success":"true",
    "user": [{
        "quotedPrice":"12345"
    }]
}
为了完整起见,这里是view.ui

Ext.define('MyApp.view.ui.MyPanel', {
    extend: 'Ext.panel.Panel',

    height: 600,
    width: 950,
    layout: {
        align: 'stretch',
        type: 'vbox'
    },
    title: 'JobPanel',

    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'tabpanel',
                    activeTab: 0,
                    flex: 1,
                    items: [
                        {
                            xtype: 'panel',
                            layout: {
                                align: 'stretch',
                                type: 'hbox'
                            },
                            title: 'Job Summary',
                            items: [
                                {
                                    xtype: 'form',
                                    id: 'formJobSummary',
                                    layout: {
                                        align: 'stretch',
                                        type: 'hbox'
                                    },
                                    bodyPadding: 10,
                                    title: '',
                                    url: '/submit.html',
                                    flex: 1,
                                    dockedItems: [
                                        {
                                            xtype: 'toolbar',
                                            flex: 1,
                                            dock: 'bottom',
                                            items: [
                                                {
                                                    xtype: 'button',
                                                    text: 'Submit'
                                                },
                                                {
                                                    xtype: 'button',
                                                    text: 'Cancel'
                                                }
                                            ]
                                        }
                                    ],
                                    items: [
                                        {
                                            xtype: 'panel',
                                            flex: 1,
                                            items: [
                                                {
                                                    xtype: 'radiogroup',
                                                    width: 400,
                                                    fieldLabel: 'Job Type',
                                                    items: [
                                                        {
                                                            xtype: 'radiofield',
                                                            boxLabel: 'Fix Price'
                                                        },
                                                        {
                                                            xtype: 'radiofield',
                                                            boxLabel: 'Production'
                                                        }
                                                    ]
                                                },
                                                {
                                                    xtype: 'textfield',
                                                    id: 'quotedPrice',
                                                    name: 'quotedPrice',
                                                    fieldLabel: 'Quoted Price'
                                                },
                                                {
                                                    xtype: 'textfield',
                                                    id: 'clientPO',
                                                    name: 'clientPO',
                                                    fieldLabel: 'Client PO'
                                                },
                                                {
                                                    xtype: 'textfield',
                                                    id: 'jobQuantity',
                                                    name: 'jobQuantity',
                                                    fieldLabel: 'Job Quatity'
                                                },
                                                {
                                                    xtype: 'textfield',
                                                    id: 'filesOver',
                                                    name: 'filesOver',
                                                    fieldLabel: 'Files Over'
                                                },
                                                {
                                                    xtype: 'textfield',
                                                    id: 'previousJobId',
                                                    name: 'previousJobId',
                                                    fieldLabel: 'Previous JobId'
                                                },
                                                {
                                                    xtype: 'textfield',
                                                    id: 'estimate',
                                                    name: 'estimate',
                                                    fieldLabel: 'Estimate'
                                                }
                                            ]
                                        },
                                        {
                                            xtype: 'panel',
                                            flex: 1
                                        },
                                        {
                                            xtype: 'panel',
                                            layout: {
                                                align: 'stretch',
                                                type: 'hbox'
                                            },
                                            flex: 1
                                        }
                                    ]
                                }
                            ]
                        },
                        {
                            xtype: 'panel',
                            title: 'Parts'
                        },
                        {
                            xtype: 'panel',
                            title: 'Process'
                        },
                        {
                            xtype: 'panel',
                            title: 'Invoice'
                        }
                    ]
                },
                {
                    xtype: 'panel',
                    layout: {
                        align: 'stretch',
                        type: 'vbox'
                    },
                    title: 'FooterPanel',
                    flex: 1
                }
            ]
        });

        me.callParent(arguments);
    }
});

问题在于如何建立记录。首先,
loadRecord
接受记录,而不是存储。下一个问题是,当您调用
loadRecord
时,存储未加载。下面是解决这个问题的修改后的商店定义。基本上,您应该绑定到存储的
load
事件,以确保记录已加载

var store = Ext.create('Ext.data.Store', {
    model: 'user',
    proxy: {
        type: 'ajax',
        url: 'data2.json',
        reader: {
            type: 'json',
            root: 'user'
        }
    },
    autoLoad: true,
    listeners: {
        load: function() {
            var form = Ext.getCmp('formJobSummary'); 
            form.loadRecord(store.data.first());
        }
    }
});

问题在于如何建立记录。首先,
loadRecord
接受记录,而不是存储。下一个问题是,当您调用
loadRecord
时,存储未加载。下面是解决这个问题的修改后的商店定义。基本上,您应该绑定到存储的
load
事件,以确保记录已加载

var store = Ext.create('Ext.data.Store', {
    model: 'user',
    proxy: {
        type: 'ajax',
        url: 'data2.json',
        reader: {
            type: 'json',
            root: 'user'
        }
    },
    autoLoad: true,
    listeners: {
        load: function() {
            var form = Ext.getCmp('formJobSummary'); 
            form.loadRecord(store.data.first());
        }
    }
});

你能提供
MyApp.view.ui.MyPanel
源代码吗?你能提供
MyApp.view.ui.MyPanel
源代码吗?啊,明白了。谢谢你为我写下这个例子。我也完全错过了使用监听器。现在工作得很好。啊,明白了。谢谢你为我写下这个例子。我也完全错过了使用监听器。现在工作得很好。