6

我正在创建一个变更日志，我决定从 .html 文件加载我的变更日志

我有

Ext.define('MeridianCRM.dialogs.recentСhanges.recentСhanges', {
    extend  : 'Ext.window.Window',
    title   : 'Последние изменения на сайте',
    modal   : true,
    height  : 400,
    width   : 500,
    resizable : false,
    html: 'changes.html',

    buttons: [{
        text: 'Закрыть',
        handler: function() {
            this.up('window').close();
        }
    }]
});

我怎么能解决这个问题？(html: 'changes.html') 如何将 html 加载到我的窗口中？

4

2 回答 2

9

有一个更好的解决方案是使用面板loader配置的声明：

loader: {
    url: 'changes.html',
    autoLoad: true
},

这将导致这个全局代码。

Ext.define('MeridianCRM.dialogs.recentСhanges.recentСhanges', {
    extend  : 'Ext.window.Window',
    title   : 'Последние изменения на сайте',
    modal   : true,
    height  : 400,
    width   : 500,
    resizable : false,
    loader: {
        url: 'changes.html',
        autoLoad: true
    },
    buttons: [{
        text: 'Закрыть',
        handler: function() {
            this.up('window').close();
        }
    }]
});

这是可取的，因为我们不需要定义 a listener，也不需要定义Ext.Ajax调用。

于 2013-10-23T09:38:57.850 回答
4

您需要异步加载 html，然后将其注入到您的组件中。所以：

Ext.Ajax.request({
    url: 'changes.html',
    success: function(response){
        // response.responseText will have your html content
        // you can then feed it into your component using update()
    }
});

因此，如果您使用 id 声明组件：

Ext.define('MeridianCRM.dialogs.recentСhanges.recentСhanges', {
    extend  : 'Ext.window.Window',
    title   : 'Последние изменения на сайте',

    id:     : 'my-log',

    ...
});

然后你可以这样做：

Ext.Ajax.request({
    url: 'changes.html',
    success: function(response){
        Ext.getCmp('my-log').update( response.responseText );
    }
});

您可以像这样将它“集成”到您的面板中：

Ext.define('MeridianCRM.dialogs.recentСhanges.recentСhanges', {
    extend  : 'Ext.window.Window',
    title   : 'Последние изменения на сайте',

    id:     : 'my-log',

    listeners: {
        'render': function()
            {
                Ext.Ajax.request({
                    url: 'changes.html',
                    success: function(response){
                        Ext.getCmp('my-log').update( response.responseText );
                    }
                });                
            }
    }

    ...
});

但请注意，如果返回的 html 包含<head>标签（因为 extjs 页面已经有标签），您可能会遇到问题。

于 2013-01-31T11:56:24.840 回答