在ExtJS 4.2.2中,为什么loadRecord()加载数据,但表单不反映新数据?

时间:2013-12-18 15:12:36

标签: extjs

使用ExtJS 4.2.2

我有一个网格,当我右键单击网格并从我的上下文菜单中选择修改时,会创建一个带有表单的窗口,并且在渲染时,我得到网格选择的行记录并使用表单loadRecord来加载记录。

Firebug显示记录已加载到表单字段中,但在呈现的表单中字段是enpty。

有什么想法吗?

以下是一些说明问题的代码。

如果你在var test ='test'的行上放一个断点;您将看到数据已加载到表单的文本字段中,但随后继续超过断点并看到文本字段不反映数据。

Ext.onReady(function() {
    Ext.define('com.myCompany.MyGridModel', {
        extend : 'Ext.data.Model',
        fields : [{
            name : 'name',
            type : 'string'
        }, {
            name : 'address',
            type : 'string'
        }, {
            name : 'type',
            type : 'string'
        }]
    });
    var store = Ext.create('Ext.data.Store', {
        model: 'com.myCompany.MyGridModel',
        proxy: {
            type: 'ajax',
            url: 'centers.json',
            reader: {
                type: 'json',
                root: 'centers'
            }
       }
    });
    store.load();
    var grid = Ext.create('Ext.grid.Panel', {
        layout: 'fit',
        store: store,
        columns: [{
            text: 'Name',
            dataIndex: 'name',
            name: 'name'
        }, {
            text: 'IP Address',
            dataIndex: 'address',
            name: 'address'
        }, {
            text: 'Type',
            dataIndex: 'type',
            name: 'type'
        }],
        renderTo: Ext.getBody(),
        listeners: {
            itemcontextmenu : function(view, record, item, index, event){
                var selectedItem = record;
                event.preventDefault();
                new Ext.menu.Menu({
                    items: [{
                        text : 'Modify',
                        handler : function(widget, event) {
                            Ext.create('Ext.window.Window', {
                                height : 380,
                                width : 540,
                                resizable : false,
                                closable: true,
                                modal: true,
                                layout :{
                                    type : 'fit'
                                },
                                items : [{
                                    xtype : 'form',
                                    frame : true,
                                    height : 250,
                                    itemId : 'centerContentForm',
                                    width : 400,
                                    bodyPadding : 10,
                                    items : [{
                                        xtype : 'textfield',
                                        itemId : 'txtName',
                                        height : 30,
                                        width : 401,
                                        fieldLabel : 'Name',
                                        name: 'name',
                                        allowBlank : false
                                    },{
                                        xtype : 'textfield',
                                        itemId : 'txtIPAddress',
                                        height : 30,
                                        width : 401,
                                        fieldLabel : 'Address',
                                        name: 'address',
                                        allowBlank : false,
                                    },{
                                        xtype : 'textfield',
                                        itemId : 'txtType',
                                        height : 30,
                                        width : 401,
                                        fieldLabel : 'Type',
                                        name: 'type',
                                        allowBlank : false
                                    }]
                                }],
                                listeners: {
                                    render: function(win) {
                                        win.down('form').loadRecord(selectedItem);
                                        var test = 'test';
                                    }
                                }
                            }).show();
                        } // end of right-click handler
                    }]
                }).showAt(event.getXY());
            }
        }
    });
    grid.getView().refresh();
});

1 个答案:

答案 0 :(得分:4)

而不是render事件处理程序,您应该使用afterrender事件处理程序。

所以你的窗口listeners配置应该是:

listeners: {
    afterrender: function(win) {
        win.down('form').loadRecord(selectedItem);
    }
}