如何使用数据存储使用JSON数据填充表单?

Dav*_*bak 1 javascript forms json datastore extjs4

如何使用数据存储使用JSON数据填充表单?文本字段如何与商店,模型相关联?

Ext.define('app.formStore', {
extend: 'Ext.data.Model',
fields: [
   {name: 'naziv', type:'string'},
   {name: 'oib', type:'int'},
   {name: 'email', type:'string'}
]
});

var myStore = Ext.create('Ext.data.Store', {
model: 'app.formStore',
proxy: {
    type: 'ajax',
    url : 'app/myJson.json',
    reader:{ 
        type:'json'                     
    }
},
autoLoad:true   
});

Ext.onReady(function() {


var testForm = Ext.create('Ext.form.Panel', {
                    width: 500,
                    renderTo: Ext.getBody(),
                    title: 'testForm',
                    waitMsgTarget: true,
                    fieldDefaults: {
                        labelAlign: 'right',
                        labelWidth: 85,
                        msgTarget: 'side'
                    },
                    items: [{
                        xtype: 'fieldset',
                        title: 'Contact Information',
                        items: [{
                                xtype:'textfield',
                                fieldLabel: 'Name',
                                name: 'naziv'
                            }, {
                                xtype:'textfield',
                                fieldLabel: 'oib',
                                name: 'oib'
                            }, {
                                xtype:'textfield',
                                fieldLabel: 'mail',
                                name: 'email'
                        }]
                    }]

            });

    testForm.getForm().loadRecord(app.formStore);
 });
Run Code Online (Sandbox Code Playgroud)

JSON

[
    {"naziv":"Lisa", "oib":"2545898545", "email":"lisa@simpson.com"}        
]
Run Code Online (Sandbox Code Playgroud)

Abd*_*oof 5

模型和表单的字段名称应匹配.然后你可以使用加载表单loadRecord().例如:

var record = Ext.create('XYZ',{
    name: 'Abc',
    email: 'abc@abc.com'
});
formpanel.getForm().loadRecord(record);
Run Code Online (Sandbox Code Playgroud)

或者,从已加载的商店中获取值.