Update : scroll for part 2 !
Part 1 : evil eval trick
Ok. So I load html in a sencha panel like this :
Ext.Ajax.request({
url:'mypage.html',
success:function(response, options) {
Ext.getCmp('myPanel').update(response.responseText, true);
},
failure:function(response, options) {
// Redirect to success for status == 0 for local files
if (response.responseText && response.status == 0) this.success(response, options);
}
});
Oh dear. I don’t know another way to load a local file except redirecting to success if the response status is 0. Sorry about that.
Next trick is : how to execute some JS inside this loaded html page. Because it doesn’t work. At all.
You’ll hate me about this, but in my local html file :
function logize() {
console.log('pouet');
}
This function is defined in a <script type=”text/javascript” id=”executeMe”>…</script> tag.
Then, in the success function, I added :
eval($('#executeMe').text());
logize();
Tricky trick is tricky ! I know eval is evil…
Any idea on how to do it nicely ?
Part 2 : nice way
Yep. The end of the eval reign has come.
I change a little bit of my html file :
(function() {
function logize() {
console.log('pouet');
}
logize();
})();
In my sencha success function :
var code = $('#executeMe').text();
var codefunc = new Function(code);
codefunc();
So :
- No eval function
- No need to rely on a global function called in sencha’s success function
- Nice closure in the html
That’s done !