I'm creating a changelog and i decided to load my changelog from .html file
I've got
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();
}
}]
});
How i can solve this ? (html: 'changes.html') How i can load html to my window ?
You'd need to load the html asynchronously, then inject it into your component. So:
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()
}
});
So if you declare you component with id:
Ext.define('MeridianCRM.dialogs.recentСhanges.recentСhanges', {
extend : 'Ext.window.Window',
title : 'Последние изменения на сайте',
id: : 'my-log',
...
});
You can then do:
Ext.Ajax.request({
url: 'changes.html',
success: function(response){
Ext.getCmp('my-log').update( response.responseText );
}
});
You can `integrate' it into your panel like so:
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 );
}
});
}
}
...
});
Notice though, that you may have issues if the returned html contains <head>
tag (as the extjs page already has one).
There is a better solution that uses the declaration of the loader
config of the panel:
loader: {
url: 'changes.html',
autoLoad: true
},
which will result in this global code.
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();
}
}]
});
This is preferable, because we do not need to define a listener
, nor an Ext.Ajax
call.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With