extjsのコンテナにiframeを追加

Question

javascriptで生成されたiframeをパネルに追加したいと思います。これはExtJSの4.xのバージョンであり、私はここでExtJSの に新しいです私のコードは、パネルとコンテナ

function generatePanel(){ 
.... 
.... 
    var thecontainer = Ext.create('Ext.form.FieldSet', { 
      title: "my container", 
      labelWidth: 1, 
      bodyStyle: "padding-right:5px;padding-left:5px;", 
      layout: 'anchor', 

     }); 

var ifrm = document.createElement("iframe"); 
    ifrm.setAttribute("src", "http://google.com/"); 
    ifrm.setAttribute("name", "myIframe"); 
    ifrm.style.width = "640px"; 
    ifrm.style.height = "480px"; 
    document.body.appendChild(ifrm); 

.... 
} 

を取得することで、これは正常に動作しますが、インラインフレームは、コンテナ内にありません。それはページの下部に現れます。私は間違って何をしていますか？

Answer 1

あなたは次のようにあなたのコンテナのアイテムとしてのiframeを作成することができます。

var thecontainer = Ext.create('Ext.form.FieldSet', { 
     title: "my container", 
     labelWidth: 1, 
     bodyStyle: "padding-right:5px;padding-left:5px;", 
     layout: 'anchor', 
     items: [{ 
      xtype: 'box', 
      autoEl: { 
       tag: 'iframe', 
       src: '//example.com', 
       width: 640, 
       height: 480 
      } 
      } 
     ] 
    }); 

または：

thecontainer.add({ 
     xtype: 'box', 
     autoEl: { 
      tag: 'iframe', 
      src: '//example.com', 
      width: 640, 
      height: 480 
     } 
     }); 

の作業例：https://fiddle.sencha.com/#fiddle/1f83