Directions Manager & document.addEventListener RRS feed

  • Question

  • I am using the Directions manager to get a Driving Route between two points. It works fine. Except that I noticed that in IE 9 & 10, I get an error when I attach an eventlistener to the page. The event listener allows the directions list that is returned from the directions manager to be interactive, meaning that the users can click on a step in the directions "list" and the map will zoom into that step. IE does not like this document.addEventListener. Firefox and Chrome does not complain. I tried removing the Listener, and calling my function without it attached, I do not get an error and my page runs fine, except that now, my directions are not interactive anymore in  Firefox and Chrome. And in IE, the directions "spill" out of my <div>.

    Has anyone encountered this before?

    mark a fisher

    I'm sorry, I should add my code.:

    //my function
    function createDrivingRoute() {
        // Initialize the DirectionsManager
        var directionsManager = new Microsoft.Maps.Directions.DirectionsManager(map2);
        // Create start and end waypoints
        var startLatitude = document.getElementById('hdnStartingLat').value;
        var startLongitude = document.getElementById('hdnStartingLng').value;
        var endLatitude = document.getElementById('hdnResponseLat').value;
        var endLongitude = document.getElementById('hdnResponseLng').value;
        var startWaypoint = new Microsoft.Maps.Directions.Waypoint({ location: new Microsoft.Maps.Location(parseFloat(startLatitude), parseFloat(startLongitude)) });
        var endWaypoint = new Microsoft.Maps.Directions.Waypoint({ location: new Microsoft.Maps.Location(parseFloat(endLatitude), parseFloat(endLongitude)) });
        // Set the id of the div to use to display the directions
        directionsManager.setRenderOptions({ itineraryContainer: document.getElementById('directions') });
        // Specify a handler for when an error occurs
        Microsoft.Maps.Events.addHandler(directionsManager, 'directionsError', displayError);
        // Calculate directions, which displays a route on the map
    function displayError(e) {
    function CallRestService(request) {
        var script = document.createElement("script");
        script.setAttribute("type", "text/javascript");
        script.setAttribute("src", request);

    I am calling this from my C# code:

    /* load the map after the DOMContent is fully loaded*/
    /*This script is the one that IE complains about, but it is ok in Firefox and Chrome*/             Page.ClientScript.RegisterStartupScript(this.GetType(), "GetDirectionsMap", "<script language='javascript'> document.addEventListener('DOMContentLoaded', GetDirectionsMap, false); </script>");
    /*This script is the one that works in all three browsers, but the Directions arent interactive like they were meant to be */                 //Page.ClientScript.RegisterStartupScript(this.GetType(), "GetDirectionsMap", "<script language='javascript'> GetDirectionsMap(); </script>");

    • Edited by MarkF67 Wednesday, June 12, 2013 5:19 PM
    Wednesday, June 12, 2013 5:12 PM


All replies

  • I covered this in one of your other posts. the addEventListener method is not supported by all browsers.  Some browsers use attachEvent instead.

    • Proposed as answer by Ricky_Brundritt Thursday, June 13, 2013 2:05 PM
    • Marked as answer by MarkF67 Thursday, June 13, 2013 2:49 PM
    Thursday, June 13, 2013 10:38 AM
  • Thanks allot Richard, the link is great. I'm reading the link associated with this. Thanks for the help.

    mark a fisher

    Thursday, June 13, 2013 1:15 PM