ExtJs4 从 URL 加载面板答案

【问题标题】：ExtJs4 load panel from URLExtJs4 从 URL 加载面板
【发布时间】：2011-11-21 15:46:42
【问题描述】：

在 ExtJs 3x 中此代码

Ext.getCmp('specific_panel_id').load({
    url:'url_containing_scripts.htm',
    scripts:true, 
    params:{
        something:else
    }
});

适用于将内容从 URL 加载到特定面板中...

但是它在 ExtJs 4.x 中不起作用。

【问题讨论】：

请具体说明“specific_panel_id”是什么。是form.Panel吗？

标签： javascript extjs extjs4

【解决方案1】：

这也有效：

Ext.define('EI.view.Viewport',{
extend: 'Ext.container.Viewport',
alias: 'widget.principal',

layout: {
    type: 'vbox',
    align: 'center',
    pack: 'center'
},

items:[
    {
        xtype: 'panel',
        title: 'Mi Documentacion',
        width: 800,
        height: 600,
        border: false,
        autoScroll: true,
        loader: {
            autoLoad:true,
            url :'http://localhost/docs/'
        }
    }

]

});

【讨论】：

【解决方案2】：

加载方法从 ExtJs4 中的 Ext.panel.Panel 中消失了。作为一种解决方法，您可以尝试使用常规 Ext.Ajax.request 加载面板内容并将这些设置为面板的项目。

例子：

var itemsConfig;
Ext.Ajax.request({
url : 'url_containing_scripts.htm',
callback : function(options, success, response) {
        itemsConfig = Ext.decode(response.text);
    }
});
Ext.getCmp('specific_panel_id').add(itemsConfig);

url_containing_scripts.htm 应该在您的面板上以 JSON 格式包含您想要的项目。

以同样的方式，您可以使用您需要的所有初始配置设置加载整个面板。

【讨论】：

【解决方案3】：

用下面的代码解决了：


dynamicPanel = new Ext.Component({
           loader: {
              url: 'url_containing_scripts.htm',
              renderer: 'html',
              autoLoad: true,
              scripts: true
              }
           });

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

【讨论】：