在ExtJS 4.2.2中，爲什麼loadRecord（）加載數據，但表單不反映新數據？

Question

使用的ExtJS 4.2.2

我有一個網格，當我右鍵單擊網格，並從我的上下文菜單中選擇修改，以形成窗戶被創建，並在渲染，我得到的網格中選中的行記錄並使用loadRecord表單加載記錄。

Firebug顯示記錄被加載到表單字段中，但在呈現的表單中這些字段是空的。

任何想法？

下面是說明問題的一些代碼。

如果你把一個斷點放在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(); 
}); 

Answer 1

而不是render事件處理程序，你應該使用afterrender事件處理程序。

所以你的窗口listeners的配置應該是：

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