如何使用 MVC 在加载时填充 Extjs 表单答案

【问题标题】：How to populate Extjs form on load using MVC如何使用 MVC 在加载时填充 Extjs 表单
【发布时间】：2014-04-03 17:39:19
【问题描述】：

我一直面临着在 MVC 中填充 extjs 表单时出现问题。我的要求是当我点击“查看个人资料”时它应该显示用户详细信息，例如名字和表格中的姓氏。我无法填充带有从服务器返回的 json 数据的表单。请告诉我如何在加载时填充表单。

这是我的商店：

    Ext.define('EManage.store.UserStore', {
        extend: 'Ext.data.Store',
        model: 'EManage.model.UserModel',    
        storeId: 'userstore',    



     proxy: {

            type: 'ajax',

            url : 'http://localhost:8080/Users/viewprofile.do?method=ViewProfileForward',  //the above action  returns user details in json object

         reader: {
                    type: 'json',
                    root: 'items'
                    }
              },
        autoLoad: true,


    });

这是我的模型：

    Ext.define('EManage.model.UserModel', {
        extend : 'Ext.data.Model',
        fields : [  
                   'firstname', 
                   'lastname', 
                    ]

       });

这是我的观点：

    Ext.define('EManage.view.emodules.myProfile.UserProfile', {

                extend: 'Ext.form.Panel',
            xtype: 'form',


                frame: true,
            title: 'View Profile',
            bodyPadding: 10,
                autoScroll:true,
            width: 355,

            fieldDefaults: {
                    labelAlign: 'right',
                    labelWidth: 115,
                    msgTarget: 'side'
            },

                initComponent: function() {
                    this.items = [{
                        xtype: 'fieldset',
                    title: 'View Profile',
                    defaultType: 'textfield',
                    defaults: {
                        anchor: '100%'
                    },
                    items: [
                            { allowBlank:false, fieldLabel: 'First Name', name: 'firstname'},
                        { allowBlank:false, fieldLabel: 'Last Name', name: 'lastname'},

                        ]
                },

                   ];

                   this.callParent();

            },
         }]
         });

【问题讨论】：

能否请您发布加载数据的代码，然后将其插入表单中。是按钮，actioncolumn...？

标签： extjs4

【解决方案1】：

不要忘记在表单中指定每个字段的名称，就像在模型中指定的那样：

items: [{
           fieldLabel: 'First Name',
           xtype: 'textfield',
           name: 'firstname'
        }, {
           fieldLabel: 'Last Name',
           xtype: 'textfield',
           name: 'lastName'
        }]

【讨论】：