Operation aborted in IE when loading your map page?

posted in: Uncategorized | 0

This one catches out every developer when they start coding in JavaScript. The issue is that you can’t change the DOM in IE before it has fully loaded. Usually everything is fine locally and in Firefox but when you deploy you get this:

OperationAborted

In the case of Virtual Earth it heavily changes the DOM, turning a simple DIV into the fully AJAX map control. What has happened is you have called map.LoadMap() while the page is loading, you need to listen for the body onload event, there are a couple of ways to do this:

The VE SDK simple attached in the body tag itself:

<body onload="GetMap();">

Now this is great in examples but rarely can you do this do to Master pages, CMS or other issues. Instead you can do this in code:


//the map object 
var map = null; 
//set page event handlers for onload and unload 
if (window.attachEvent) { 
window.attachEvent("onload", Page_Load); 
window.attachEvent("onunload", Page_Unload); 
} else { 
window.addEventListener("DOMContentLoaded", Page_Load, false); 
window.addEventListener("unload", Page_Unload, false); 
} 
//load map    
function Page_Load() { 
//add your map loading code here 
}  
//Clean up all objects 
function Page_Unload() { 
    if (map!=null) { 
        map.Dispose(); 
        map = null; 
    } 
}

 

Notice I also dispose the map on unload.

If you are using a javascript library like MS AJAX or JQuery they have helpers to do this also. If you want a more complete sample using jquery have a look at my article here:

http://www.liveside.net/developer/archive/2008/11/13/virtual-earth-basics-part-1-loading-the-map.aspx