Question

I've created an iFrame dynamically with Mootools. In my iFrame, I want to execute a function to automatically populate it. So far, I've the following code:

    var mApp = this.app;
    var iframe = new Element('iframe', {
      'src' : 'frame_fittingbox.html',
      'style' : 'height:100%;width:100%;background:transparent;border:none;',
      'events' : {
        'load' : function() {
          var doc_iframe = (iframe.contentWindow) ? iframe.contentWindow : (iframe.contentDocument.document) ? iframe.contentDocument.document : iframe.contentDocument;
          doc_iframe.run(mApp, 'demo'); // FittingBox account
        },
      },
    });

    var container = this.app.page();
    iframe.inject(container);

In the iFrame, I've that code:

<html>
  <head>
    <script src="./app/components/exported_jsfile.js" />
    <script>
      function run(app, account) {
        document.write('\x3Cscript type="text/javascript" src="http://my.website.com/js/' +account+ '/jsfile.js">\x3C/script>');

        var customClass = new My_Custom_Class(app, document.body);
        customClass .open();
      }
    </script>
  </head>

  <body>
    Loading ...
  </body>
</html>

It doesn't work as the run function is never called. In the console, I got the following message: Uncaught TypeError: Object [object global] has no method 'run'. What did I make wrong ?

Thanks for your precious help.

Was it helpful?

Solution

The solution is to use a callback in the parent frame. So, when you need to perfom an action, use the following code:

parent.window.parent.actionFromParent();

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top