On my application homepage, I built a 'widgets' system. The source of the widgets is generated server side, and pushed to the client through Ajax.
Ext.Ajax.request({
url: '/get-widgets',
success: function( response ) {
var boxes = Ext.decode( response.responseText );
Ext.each( boxes, function( box ) {
box.id = 'cell-' + box.cell;
var element = Ext.DomHelper.append( 'canvas', {
tag: 'div',
id: box.id,
cls: 'widget size-' + ( box.size || '11' ),
children: [{
tag: 'div',
cls: 'title',
html: box.title
}, {
tag: 'div',
cls: 'main',
html: box.body
}]
}, true );
});
开发者_JAVA百科 }
});
The problem is, that some widgets have some inline Javascript in their body, that needs to be executed. This works perfectly in Firefox, but does not in Chrome.
Is there a flag or something you need to activate for the inline code to be executed?
Found out the Ext.Element::update()
method features a flag to scan for and execute inline scripts. I changed my code as follows to utilize this method:
var element = Ext.DomHelper.append( 'canvas', {
tag: 'div',
id: box.id,
cls: 'widget size-' + ( box.size || '11' ) + ' ' + ( box.cls || '' ) + ' ' + ( box.type || '' ),
children: [{
tag: 'div',
cls: 'title',
html: box.title
}, {
id: box.id + '-body',
tag: 'div',
cls: 'main'
}]
}, true );
Ext.get( box.id + '-body' ).update( box.body, true );
精彩评论