JavaScript appendChild Not Working/Completing

Zerdrabeopene

New Member
I've been working on a project that essentially creates an image map using data stored in an XML file. As far as I can tell, the code makes it to the very end but fails on the "mapGoesHere.appendChild(mapStructure);" line of code. This is the code in its entirety...basically scroll down to the bottom to reach the processRoomData function where I believe the code is dying:\[code\]function loadSingleXML(fileToLoad, howToHandle) { var xmlDoc = new ActiveXObject ("Microsoft.XMLDOM"); xmlDoc.async="false" xmlDoc.load(fileToLoad); alert("xmldoc.load(fileToLoad)"); var errorCode = xmlDoc.readyState; if (errorCode == 4) { howToHandle(xmlDoc); alert("howToHandle(xmlDoc)"); } else { alert("Unable to load the document " + url + "\n Error: " + errorCode); }}function createRoomData(xmlRooms) { var roomData = http://stackoverflow.com/questions/15847005/new Array(); roomData.roomCount = rooms.length; for (var r=0; r<xmlRooms.length; ++r) { roomData[r] = new Object(); roomData[r].portList = xmlRooms[r].getAttribute("ports"); roomData[r].number = xmlRooms[r].getAttribute("number"); roomData[r].occList = xmlRooms[r].getAttribute("occupant"); roomData[r].coordList = xmlRooms[r].getAttribute("coords"); } return roomData;}function createMapStructure (xmlRoomData) { var mapStructure; var roomData; var area; rooms = xmlRoomData.getElementsByTagName("room"); roomData = http://stackoverflow.com/questions/15847005/createRoomData(rooms); mapStructure = document.createElement("map"); for (var r=0; r<roomData.length; ++r) { area = document.createElement("area"); area.setAttribute("name", roomData[r].numbersList); area.setAttribute("shape", "rect"); area.setAttribute("coords", roomData[r].coordList); area.setAttribute("onmouseover", "return overlib('" + roomData[r].portList + "', CAPTION, '" + roomData[r].occList + "');"); area.setAttribute("onmouseout", "nd();"); mapStructure.appendChild(area); } return mapStructure;}var mapLocation = "xml/floorOne.xml";function processRoomData(mapData) { mapStructure = createMapStructure(mapData); alert("COMPLETED: createMapStructure"); mapStructure.setAttribute("name", "PortMap"); alert("COMPLETED: setAttribute"); mapGoesHere = document.getElementById("portNumbs"); alert("COMPLETED: getElementById"); mapGoesHere.appendChild(mapStructure); alert("COMPLETED: appendChild");}loadSingleXML(mapLocation, processRoomData);\[/code\]In the processRoomData function at the bottom I added an alert after each step to try to figure out where my code was hanging up. The last alert (COMPLETED: appendChild) does not appear, leading me to believe the code is getting hung up on that specific line of code. Unfortunately, I do not know enough about programming to understand why. Could someone be kind enough to point out the error of my ways and explain in a manner that a novice programmer could understand? Thank you.EDIT:Thought the HTML side of things may be relevant, too, so here's the HTML. There isn't much.\[code\]<html> <head> <title>Combo Test</title> <script type="text/javascript" src="http://stackoverflow.com/questions/15847005/javascript/overlib.js"></script> <script type="text/javascript" src="http://stackoverflow.com/questions/15847005/javascript/xml-ie-load.js"></script> </head> <body> <div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;"></div> <IMG WIDTH="1673" HEIGHT="1293" SRC="http://stackoverflow.com/questions/15847005/images/floor1.png" border="2" ismap usemap="#PortMap" /> <div id="portNumbs"></div> </body></html>\[/code\]
 
Back
Top