Javascript wait until iframe has reloaded

Question

Fixing the following javascript code contains my newest task:

// submit the form in the iframe:
document.getElementsByTagName("iframe")[0].contentWindow.dojo.byId(buttonId).click(); 
// wait 50msec for result to be loaded:
window.setTimeout(function(){
    // get documentId of newly created document from result
    var docId = document.getElementsByTagName("iframe")[0].
                    contentWindow.dojo.byId("documentIdDiv").innerHtml;
    // put documentId into the outer form
    Ext.getCmp("form").getForm().findField("documentId").setValue(docId);
    // submit outer form
    Ext.getCmp("form").getForm().submit({
        ...
    });
}, 50);
// TODO: Error if result is not available after 50ms.

I now have to find a way to execute the anonymous function once the iframe has reloaded.

I thought of using a body onload on the iframe, but I can't, because I would have to insert it in the body of the new page.

Answer 1

Haha, trying to get this to work on JSFiddle was more difficult. Since they load javascript seperately from html. Anyways this should work.

DEMO

//function that happens when loaded
function loaded() {
    b.innerHTML = 'Call Back Worked';
};
//gets elements and sets them to variables
var b = document.getElementById('callback')
var a = document.getElementById("myframe");
//listens to load event
a.addEventListener("load", loaded());