如何添加DOM節點到ExtJS中的面板

-1

我需要在ExtJS應用程序中嵌入遺留的JavaScript代碼。我們的應用程序將使用ExtJS對話框來顯示舊的javasccript表單（在我們最終在ExtJS中重做它們之前）。如何添加DOM節點到ExtJS中的面板

我想一個DOM節點添加到Ext.Panel（或Ext.window.Window爲此事）。不確定它是否可能或者有什麼方法。我需要某種的appendChild類似下面方法：

var mainPanel = document.create('div'); 

mainPanel.appendChild(getVeryComplicatedLegacyHTML()) 


var p = new Ext.Panel({ 
    title: 'another panel', 
    titleCollapse: true 
}); 

p.appendChild(mainPanel); //???

在ExtJS的這是在所有可能的？

來源

2014-07-08 Oliver Watkins

這是在ExtJS的所有可能嗎？

有此沒有魔法......下轉覆蓋平原舊的HTML和css

Ext.panel.Panel（任何分機成分及其後代）沒有appendChild方法。具有DOMElement appendChild method的Ext.dom.Element包裝，並且任何組件都通過el//getEl()具有其元素參考。

簡單的例子，創建一個輔助組件與面板內的遺留HTML。當面板被呈現，則遺留HTML是在組件內部注入，使用update()方法（它使用this.el.update()element method inside）：

var p = new Ext.Panel({ 
    title: 'another panel', 
    titleCollapse: true, 
    items: [ 
    { 
     xtype: 'box', 
     itemId: 'fake-cmp' 
    }], 
    listeners: { 
     boxready: function(panel) { 
      var fakeCmp = panel.down('#fake-cmp'); 
      fakeCmp.update(getVeryComplicatedLegacyHTML()); 
     } 
    } 
});

ExtJS

來源

2014-07-08 21:20:52 babinik

在您的第4行，fakeComponnet.el是未定義的。此組件是否需要首先添加到某個位置或在它包含DOM對象之前進行渲染？ –

是的，我已經更新了答案（當面板呈現僞組件更新與傳統的HTML）。當一個組件被渲染時，它的'el'可以被用來添加/更新等。 – babinik

如果我有行fakeCmp.update（document.createElement（'div'））;它不渲染。它只是在面板 –

如何添加DOM節點到ExtJS中的面板

回答

相關問題