Question

In my website, I have a form which allows users to post an image or a video to Facebook. Because I need to post the files directly to Facebook, I’m using a form that is posting to an Iframe (To prevent redirected the user to the Facebook post url, after the post is sent).

While the post is being sent (Its important to note that the post is sent to a Facebook domain and not my own domain), I present the user a waiting message, and when the post is finished, I use the iframe onload event to hide the message.

Here is the code:

The iframe:

<iframe name="uploader" width=2px height=2px style="visibility: hidden" onLoad="locationChange(this)"></iframe>

The JavaScript for hiding the message, when the iframe is loaded:

function locationChange(ifrm) 
{
    alert("Iframe Change");
    document.getElementById("loadingOff").style.visibility = "hidden";
}

That works on all browsers except IE9. I can see the “Iframe Change” message on IE9 when I first enter the page. But I don’t see it after the post is sent (On Chrome and FireFox I see the message twice, when I enter the page and after the post is sent).

I’ve also tried using this:

<script type='text/javascript'>
 var iframe = document.getElementsByName("uploader");

 alert(iframe.toString());

 iframe.onload = iframe.onreadystatechange = function(){
     if( this.readyState && this.readyState !== "complete" && this.readyState !== "loaded" )
     {
           alert("Not loaded");
     }
    alert("Local iframe is now loaded");
 }         
</script>

and also this:

if (iframe.attachEvent){
    iframe.attachEvent("onload", function(){
        alert("Local iframe is now loaded.");
    });
} else {
    iframe.onload = function(){
        alert("Local iframe is now loaded.");
    };
}

But the last two didn’t work on any of the browsers. How can I attach the onload event to IE9 ?

Thanks.

Answer 1

getElementsByName returns array of elements.

so write

var iframe = document.getElementsByName("uploader")[0];

instead of

var iframe = document.getElementsByName("uploader");