2013-08-19 18 views
6

Ben bir Ext.panel.Panel kullanıyorum ve harici bir web sayfasından içeriği panelime yüklerim. Burada açıklandığı gibiExtJS 4.1 harici web sayfasından içerik yükleme

Ben yükleyici kullanmayı denedim: loader question

ve bu jsfiddle bir örnek buldum edebilirsiniz: http://jsfiddle.net/eternasparta/sH3fK/

Ext.require([  
'Ext.form.*', 
'Ext.tip.*' 
]); 


Ext.onReady(function() {  


Ext.QuickTips.init(); 

Ext.create('Ext.panel.Panel',{ 
renderTo: Ext.getBody(), 
height:400, 
    width:400, 
    id:'specific_panel_id' 
}); 

dynamicPanel = new Ext.Component({ 
     loader: { 
      /*load contents from this url*/ 
      url: 'http://it.wikipedia.org/wiki/Robot', 
      renderer: 'html', 
      autoLoad: true, 
      scripts: true 
      } 
     }); 

Ext.getCmp('specific_panel_id').add(dynamicPanel); 

}); 
Muhtemelen

Ben nasıl kullanılacağını anlamadınız Harici web sayfaları ile yükleyici (eğer mümkünse). Yani benim ilk sorum: Yükleyici kullanarak sayfamı http://it.wikipedia.org/wiki/Robot sayfamıza yüklemek mümkün mü?

İkinci soru: Yanıt "hayır" ise, o sayfanın içeriğini nasıl yüklemenizi önerirsiniz?

size bir güvenlik nedenleri (Access-Control-Allow-Origin) tüm

+1

iFrame'den ne haber? –

cevap

10

Dış içerik için bir iframe kullanmanız gerekecektir. Bir Pencere ve dinamik sayfa yükleme sırasında ile

Ext.define('MyIframePanel', { 
    extend: 'Ext.panel.Panel', 
    layout: 'fit', 
    items: [{ 
     xtype: 'box', 
     autoEl: { 
      tag: 'iframe', 
      src: 'http://it.wikipedia.org/wiki/Robot', 
     }, 
    }] 
}); 

Ayrıca bkz örnek: o iframe'in boyutları kabını paneli tarafından yönetilmesini istiyor Ancak eğer, bunu bir bileşen yapmak yerine sadece html özelliğini kullanarak gerekecek son blog gönderimim: http://nohuhu.org/development/using-render-selectors-to-capture-element-references/.

+0

Önerilen çözümünüze bağımsız olarak ulaştım. Hepinize teşekkür ederim – Marco

3

ederiz.

Sadece olarak panelin "html" özelliğini ayarlayabilirsiniz:

html: '<iframe src="http://it.wikipedia.org/wiki/Robot"></iframe>', 

bakınız: size aynı etki alanından sayfa yüklerseniz http://jsfiddle.net/sH3fK/2/

, sadece ayarlayabilirsiniz "yükleyici" özelliği Paneliniz:

Ext.create('Ext.panelPanel', { 
    ... 
    loader: { 
     url: 'content.html', //<-- page from the same domain 
     autoLoad: true 
    }, 
    renderTo: Ext.getBody(), 
    ... 
}); 
+0

Ama sanırım, bu html dosyası kendi etki alanınızda olsa bile, yalnızca bu html sayfasının içinde yazılmış komut dosyalarını yüklemez; – Asqan