使用JSON读取的EXTJS 4表单填充

我是EXTJS新手，目前正在使用EXTJS-4.1。 我有一个基本表单，需要在页面加载时填充数据。 服务器url将返回一个JSON

[{"countryid":1,"countrycode":"US","countryname":"United States"}]

我的表格代码是

Ext.require([
    'Ext.form.*'
    //'Ext.layout.container.Column',
    //'Ext.tab.Panel'
    //'*'
]);

Ext.onReady(function() {
    Ext.QuickTips.init();

    var bd = Ext.getBody();

    /*
     * ================  Simple form  =======================
     */
    bd.createChild({tag: 'h2', html: 'Form 1 - Very Simple'});

    var required = '<span style="color:red;font-weight:bold" data-qtip="Required">*</span>';

Ext.define('app.formStore', {
extend: 'Ext.data.Model',
fields: [
   {name: 'countryid'},
   {name: 'countrycode'},
   {name: 'countryname'}
]
});

var myStore = Ext.create('Ext.data.Store', {
model: 'app.formStore',
proxy: {
    type: 'ajax',
    url : 'http://localhost/milestone_1/web/app_dev.php/md/country/show/1',
    reader:{ 
        type:'json'                     
    }
},
autoLoad:true,
    listeners: {
        load: function() {
            var form = Ext.getCmp('formJobSummary'); 
            form.loadRecord(myStore.data.first());
        }
    }
});


var testForm = Ext.create('Ext.form.Panel', {
                    width: 500,
                    renderTo: Ext.getBody(),
                    title: 'Country Form',
                    waitMsgTarget: true,
                    fieldDefaults: {
                        labelAlign: 'right',
                        labelWidth: 85,
                        msgTarget: 'side'
                    },
                    items: [{
                        xtype: 'fieldset',
                        items: [{
                                xtype:'textfield',
                                fieldLabel: 'ID',
                                name: 'countryid'
                            }, {
                                xtype:'textfield',
                                fieldLabel: 'CODE',
                                name: 'countrycode'
                            }, {
                                xtype:'textfield',
                                fieldLabel: 'COUNTRY',
                                name: 'countryname'
                        }]
                    }]

            });


    this.testForm.getForm().loadRecord(app.formStore);
});

我能够将相同的JSON填充到网格中。你能帮我渡过。。。 我在网上得到了很多例子，我试过了，但还是没有成功。上面给出的也是我在浏览时得到的一段修改后的代码片段。

尝试以下几点：

1如果你在本地主机上搜索你的文件，不要把本地主机放在url上 只写

url:“/milestone_1/web/app_dev.php/md/country/show/1”

你的php文件做什么？你能把密码寄出去吗

---

3将代理配置放置在模型上，而不是存储上

4您是否尝试过测试存储区是否已读取加载的记录？使用console.log？加载功能是异步的。所以，您做了一件正确的事情—为load事件创建一个处理程序并将逻辑放在那里。然而，你犯了两个错误：

在加载处理程序中，您将为函数设置一些参数。第一个参数是store，所以您不需要使用全局变量

您不需要有这个。testForm.getForm.loadRecordapp.formStore；-因为这不是一个有效的命令，而且在那一刻你不知道你的存储是否真的被加载了。移除它。存储处理程序中已经有loadRecords

表单呈现和存储自动加载是两个不同的事件，您无法控制它们的计时。因此，我建议禁用store的自动加载，并在知道表单准备就绪后手动调用store.load

var form=Ext.getCmp'formJobSummary'；console.logform可能返回undefined。为表单指定一个名称，然后开始。或者更好的是

// Ext.require([
// 'Ext.form.*'
//'Ext.layout.container.Column',
//'Ext.tab.Panel'
//'*'
// ]); // you dont need ext.require for ext integrated stuff

Ext.onReady(function () {
    Ext.QuickTips.init();

    //var bd = Ext.getBody(); 

    /*
     * ================  Simple form  =======================
     */
    //bd.createChild({
    //  tag: 'h2',
    //  html: 'Form 1 - Very Simple'
    //}); // over written by the form anyway

    // var required = '<span style="color:red;font-weight:bold" data-qtip="Required">*</span>'; // never used

    Ext.define('app.formStore', {
        extend: 'Ext.data.Model',
        fields: [{
            name: 'countryid'
        }, {
            name: 'countrycode'
        }, {
            name: 'countryname'
        }]
    });



    var testForm = Ext.create('Ext.form.Panel', {
        width: 500,
        renderTo: Ext.getBody(),
        name:'formJobSummary', //why your orignal bit wasn't working
        title: 'Country Form',
        waitMsgTarget: true,
        fieldDefaults: {
            labelAlign: 'right',
            labelWidth: 85,
            msgTarget: 'side'
        },
        items: [{
            xtype: 'fieldset',
            items: [{
                xtype: 'textfield',
                fieldLabel: 'ID',
                name: 'countryid'
            }, {
                xtype: 'textfield',
                fieldLabel: 'CODE',
                name: 'countrycode'
            }, {
                xtype: 'textfield',
                fieldLabel: 'COUNTRY',
                name: 'countryname'
            }]
        }]

    });

    var myStore = Ext.create('Ext.data.Store', {
        model: 'app.formStore',
        proxy: {
            type: 'ajax',
            url: 'http://localhost/milestone_1/web/app_dev.php/md/country/show/1',
            reader: {
                type: 'json'
            }
        },
        autoLoad: true,
        listeners: {
            load: function (store,record,e) {
                testForm.loadRecord(store.first());
            }
        }
    });


});

---

出于好奇，你为什么建议个人记录有自己的代理设置？你是什么意思？我只问他是否验证商店是否上传了数据。你怎么检查？我通常要求记录计数。你不认为吗？3将代理配置放在模型上，而不是存储上。呃，我想这是一个错误的措辞。模型，而不是record.load:function store，record，e{form.loadRecordstore.first；}应该是：load:function store，record，e{textForm.loadRecordstore.first；}编辑是您的朋友