ExtJS永続パネル（autoDestroyなし）

Question

おはようございます！

私はExtJSの永続パネルに関する質問があります。私は単一のコンテナパネルの中に表示したいいくつかのフォームパネルを持っています。表示されるフォームは、ユーザーが編集しているオブジェクトのタイプによって異なります。問題がある

• のremoveAll（真）
• アドオン（永続的な書式パネル）
• doLayout（）

：私の知る限り理解し、これには以下の3つのステートメントによって達成することができますこれは動作していないようです。 2つの異なる永続フォームパネルを使用している場合、両方ともコンテナパネルに固執します。

• のremoveAll（真）
• アドオン（新しいフォーム：奇妙なことは、私が永続的なパネルを使用していますが、フォームのパネルに私は、コンテナに追加するたびに再作成していない時に動作するようには思えないということですへの適切な方法は何ですか

  <script type="text/javascript" language="javascript"> 
      Ext.namespace("Ext.ARA"); 
  
      Ext.onReady(function() 
      { 
      Ext.ARA.AddFormPanelDoesntWorkA = function() 
      { 
       Ext.ARA.ContainerPanel.removeAll(false); 
       Ext.ARA.ContainerPanel.add(Ext.ARA.FormPanelA); 
       Ext.ARA.ContainerPanel.doLayout(); 
      } 
  
      Ext.ARA.AddFormPanelDoesntWorkB = function() 
      { 
       Ext.ARA.ContainerPanel.removeAll(false); 
       Ext.ARA.ContainerPanel.add(Ext.ARA.FormPanelB); 
       Ext.ARA.ContainerPanel.doLayout(); 
      } 
  
      Ext.ARA.AddFormPanelDoesWorkA = function() 
      { 
       Ext.ARA.ContainerPanel.removeAll(true); 
       Ext.ARA.ContainerPanel.add(new Ext.form.FormPanel({title:'Form Panel A', padding:5, items:[new Ext.form.TextField({fieldLabel:'Panel A Field', anchor:'100%'})]})); 
       Ext.ARA.ContainerPanel.doLayout(); 
      } 
  
      Ext.ARA.AddFormPanelDoesWorkB = function() 
      { 
       Ext.ARA.ContainerPanel.removeAll(true); 
       Ext.ARA.ContainerPanel.add(new Ext.form.FormPanel({title:'Form Panel B', padding:5, items:[new Ext.form.TextField({fieldLabel:'Panel B Field', anchor:'100%'})]})); 
       Ext.ARA.ContainerPanel.doLayout(); 
      } 
  
      Ext.ARA.FormPanelA = new Ext.form.FormPanel({title:'Form Panel A', padding:5, items:[new Ext.form.TextField({fieldLabel:'Panel A Field', anchor:'100%'})]}); 
      Ext.ARA.FormPanelB = new Ext.form.FormPanel({title:'Form Panel B', padding:5, items:[new Ext.form.TextField({fieldLabel:'Panel B Field', anchor:'100%'})]}); 
  
      Ext.ARA.ContainerPanel = new Ext.Panel 
      ({ 
       title:'Container Panel', 
       bbar:new Ext.Toolbar 
       ({ 
       items: 
       [ 
        {text:'AddFormPanelDoesntWorkA', handler:Ext.ARA.AddFormPanelDoesntWorkA}, 
        {text:'AddFormPanelDoesntWorkB', handler:Ext.ARA.AddFormPanelDoesntWorkB}, '->', 
        {text:'AddFormPanelDoesWorkA', handler:Ext.ARA.AddFormPanelDoesWorkA}, 
        {text:'AddFormPanelDoesWorkB', handler:Ext.ARA.AddFormPanelDoesWorkB} 
       ] 
       }) 
      }); 
  
      Ext.ARA.Mainframe = new Ext.Viewport({layout:'fit', items:[Ext.ARA.ContainerPanel]}); 
      }); 
  </script> 
  

  ：パネル（））

• doLayout（）

は、以下の実施例を参照してください。 ExtJSで永続的なフォームパネルを使用しますか？私はここで間違って何をしていますか？

Answer 1

私はあなたの例を試してみて、いくつか微調整を行い、うまく動作しなかったので、この種の表示にはCardLayoutを使用したと思いました。 LayoutBrowserを参照してください。ここでは、「ウィザード」タイプのディスプレイを使用しています。私はそれがあなたに必要なものを与えるだろうと思う。