ExtJS：FormPanelを削除してウィンドウに読み込む

Question

FormPanelをウィンドウから削除したいという問題があります。ここで

はウィンドウにロードされている私のフォームです：

myForm = new Ext.FormPanel({ 
    frame: true, 
    width: '100%', 
    id: 'myform', 
    layout: 'form', 
    autoHeight: true, 
    autoDestroy: false, 
    region: 'center', 
    monitorValid: true, 
    items: [{ 
     xtype: 'textfield', 
     id: 'mytextfield', 
     fieldLabel: 'My Label', 

    }] 
}); 

MyWindow = new Ext.Window({ 
    title: 'MyWindow', 
    layout: 'auto', 
    resizable: false, 
    width: 717, 
    autoheight:true, 
    id:'mywindow', 
    closeAction:'hide', 
    closable: true, 
    items:[Ext.getCmp("myform")] 


    }); 

は、今私は、このフォームを削除し、別のフォームを表示する必要がありますする必要、と私は他にこのどこかのようにやっている：

MyWindow.removeAll(); 
MyWindow.add(Ext.getCmp("myAnotherForm")); 

しかし、これは私にエラー"Uncaught TypeError: Cannot read property 'events' of undefined"をext-all-debug.jsで与えます。

ここには何かがありますか？

ありがとうございました。

Answer 1

フォームを削除し、次のコードを使用して別のフォームを追加することができます：上記のため

Ext.onReady(function() { 
    var btn = new Ext.Button({ 
     id : 'button', 
     width : 100, 
     height : 30, 
     text : 'click me', 
     listeners : { 
      click : function(){ 
       var myanother = myAnotherForm; 
       var anotherbtn = btn1; 
       Mywindow.removeAll(); 
       Mywindow.add(myanother); 
       Mywindow.add(anotherbtn); 
       Mywindow.doLayout(); 
      } 
     } 
    }); 
    var btn1 = new Ext.Button({ 
     id : 'button1', 
     width : 100, 
     height : 30, 
     text : 'Another button' 
    }); 
    myAnotherForm = new Ext.FormPanel({ 
    frame: true, 
    width: '100%', 
    id: 'myanotherform', 
    layout: 'form', 
    autoHeight: true, 
    autoDestroy: false, 
    region: 'center', 
    monitorValid: true, 
    items: [{ 
     xtype: 'textfield', 
     id: 'mytextfield', 
     fieldLabel: 'My Another Label', 
    }] 
});  
    myForm = new Ext.FormPanel({ 
    frame: true, 
    width: '100%', 
    id: 'myform', 
    layout: 'form', 
    autoHeight: true, 
    autoDestroy: false, 
    region: 'center', 
    monitorValid: true, 
    items: [{ 
     xtype: 'textfield', 
     id: 'mytextfield', 
     fieldLabel: 'My Label', 
    }] 
});  
    var Mywindow = new Ext.Window({ 
     title: 'MyWindow',  
     layout: 'auto',  
     resizable: false, 
     width: 317,  
     autoheight:true, 
     id:'mywindow',  
     closeAction:'hide', 
     closable: true, 
     items : [myForm,btn]  
    }); 
    Mywindow.show(); 
}); 

ワーキングサンプルがある、次のとおりです。

私は周りに働いている

http://jsfiddle.net/kesamkiran/MVewR/1/

* Click on 'click me' button then you will get the another form with another button.If you want to change only form,then you can remove the button.