?
Solved

JavaScript works in IE but not in Firefox - XML DOM objects

Posted on 2007-07-24
16
Medium Priority
?
583 Views
Last Modified: 2007-12-19
Script is working in IE but not in firefox.

Hey everyone. I'm having trouble figuring out how to make this script work in both IE and firefox. The javascript can be viewed here: http://ride.dsu.dal.ca/test2.html

and the script is the following:
<script type="text/javascript">
   <!--
function getXMLhttp() {
      var C=null;
      try{
            C=new ActiveXObject("Msxml2.XMLHTTP");
      }catch(e){
            try{
                  C=new ActiveXObject("Microsoft.XMLHTTP");
            }catch(sc){
                  C=null;
            }
      }
      if(!C&&typeof XMLHttpRequest!="undefined"){
            C=new XMLHttpRequest();
      }
      return C;
}
request = getXMLhttp();
if (request) {
      request.open("GET", "xml", true);
      request.onreadystatechange = function() {
         if (request.readyState == 4 && request.status == 200) {
            var xmlDoc = request.responseXML;

   var city = xmlDoc.getElementsByTagName("city");
   var unemployment = parseInt(city[0].getElementsByTagName("unemployment")[0].text);
   var transport = parseInt(city[0].getElementsByTagName("transport")[0].text);
   var criminality = parseInt(city[0].getElementsByTagName("criminality")[0].text);
   var pollution = parseInt(city[0].getElementsByTagName("pollution")[0].text);

   document.write("" + unemployment + " Unemployment<br>" + transport + " Transport<br>" + criminality + " Criminality<br>" + pollution + " Pollution");

   if (unemployment + (100 - transport) + criminality + pollution == 0)
   {
      document.write("<br><br><br>Population needs Attention!<br>");
      document.location.href = "http://synthlight.miniville.fr/";
   }
   else if( (100 - transport) >= unemployment && (100 - transport) >= criminality && (100 - transport) >= pollution )
   {
      document.write("<br><br><br>Transport needs Attention!<br>");
      document.location.href = "http://synthlight.miniville.fr/tra";
   }
   else if( unemployment >= criminality && unemployment >= pollution )
   {
      document.write("<br><br><br>Commerce (for unemployment) needs Attention!<br>");
      document.location.href = "http://synthlight.miniville.fr/com";
   }
   else if( criminality >= pollution )
   {
      document.write("<br><br><br>Security (for crime) needs Attention!<br>");
      document.location.href = "http://synthlight.miniville.fr/sec";
   }
   else
   {
      document.write("<br><br><br>Environment (for pollution) needs Attention!<br>");
      document.location.href = "http://synthlight.miniville.fr/com";
   }
         }
       };
}
request.send(null);
</script>

What I am noticing is that firefox works perfectly, the XML values are extracted, displayed, and the if statements work properly, but in firefox, something goes wrong, all the values are parsed as 'NAN' and the if statement defaults to the else case.

How can I make this script work in both browsers? I thought that the commands for xmlDom objects would work the same in both browsers after I had opened it (which is done differently in each browser.)
0
Comment
Question by:alainbryden
  • 7
  • 6
  • 3
16 Comments
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 19560550
Let's try changing the If part.  Use this ...

      try{
            C=new ActiveXObject("Msxml2.XMLHTTP");
      }catch(e) {
            try{
                  C=new ActiveXObject("Microsoft.XMLHTTP");
            }catch(e) {
                  try {
                  C=new XMLHttpRequest();
                }catch(e) { alert ('Not supported'); }
          }
      }
      return C;

Let me know how that works or if you have a question.

bol
0
 
LVL 21

Author Comment

by:alainbryden
ID: 19561178
that has the same effect.

I'm actually finding something new, and that's that the script sometimes causes ie to hang. I don't know why it would.
0
 
LVL 21

Author Comment

by:alainbryden
ID: 19561407
Okay, it's not hanging IE anymore, but it still doesn't work in firefox. This is the code once more - and I repeat - firefox is defaulting to the else statement, which means it is getting into the request code, which means that try catch statement is fine how it is, it is sucessfully retrieving the XML object.

The problem must be in the code somewhere in these four lines:

      var city = xmlDoc.getElementsByTagName("city");
      var unemployment = parseInt(city[0].getElementsByTagName("unemployment")[0].text);
      var transport = parseInt(city[0].getElementsByTagName("transport")[0].text);
      var criminality = parseInt(city[0].getElementsByTagName("criminality")[0].text);
      var pollution = parseInt(city[0].getElementsByTagName("pollution")[0].text);


here is the code again:
_______________________________________________________________
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
      <head>
            <META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript">
            <title>Synthlight City</title>
      </head>
      <body>
<script type="text/javascript">
   <!--
function getXMLhttp()
{
      var C=null;
      try
      {
            C=new ActiveXObject("Msxml2.XMLHTTP");
      }
      catch(e)
      {
            try
            {
                  C=new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(e)
            {
                  try
                  {
                        C=new XMLHttpRequest();
                  }
                  catch(e)
                  {
                        alert ('Not supported');
                  }
                }
      }
      return C;
}
request = getXMLhttp();
if (request)
{
      request.open("GET", "xml", true);
      request.onreadystatechange = function()
      {
            if (request.readyState == 4 && request.status == 200)
            {
                  var node;
                  var xmlDoc = request.responseXML;

                  var city = xmlDoc.getElementsByTagName("city");
                  var unemployment = parseInt(city[0].getElementsByTagName("unemployment")[0].text);
                  var transport = parseInt(city[0].getElementsByTagName("transport")[0].text);
                  var criminality = parseInt(city[0].getElementsByTagName("criminality")[0].text);
                  var pollution = parseInt(city[0].getElementsByTagName("pollution")[0].text);
                  node = document.createTextNode("" + unemployment + " Unemployment<br>" + transport + " Transport<br>" + criminality + " Criminality<br>" + pollution + " Pollution");
                  document.getElementById("p1").appendChild(node);
                  if (unemployment + (100 - transport) + criminality + pollution == 0)
                  {
                        node = document.createTextNode("<br><br><br>Population needs Attention!<br>");
                        document.getElementById("p1").appendChild(node);
                        window.location = "http://synthlight.miniville.fr/";
                  }
                  else if( (100 - transport) >= unemployment && (100 - transport) >= criminality && (100 - transport) >= pollution )
                  {
                        node = document.createTextNode("<br><br><br>Transport needs Attention!<br>");
                        document.getElementById("p1").appendChild(node);
                        window.location = "http://synthlight.miniville.fr/tra";
                  }
                  else if( unemployment >= criminality && unemployment >= pollution )
                  {
                        node = document.createTextNode("<br><br><br>Commerce (for unemployment) needs Attention!<br>");
                        document.getElementById("p1").appendChild(node);
                        window.location = "http://synthlight.miniville.fr/com";
                  }
                  else if( criminality >= pollution )
                  {
                        node = document.createTextNode("<br><br><br>Security (for crime) needs Attention!<br>");
                        document.getElementById("p1").appendChild(node);
                        window.location = "http://synthlight.miniville.fr/sec";
                  }
                  else
                  {
                        node = document.createTextNode("<br><br><br>Environment (for pollution) needs Attention!<br>");
                        document.getElementById("p1").appendChild(node);
                        window.location = "http://synthlight.miniville.fr/env";
                  }
            }
       };
}
request.send(null);
   -->
</script>

You should be redirected to synthlight city automatically. If not, click <a href="http://synthlight.miniville.fr/">here</a>.

<p ID="p1"></p>
      </body>
</html>
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
LVL 21

Author Comment

by:alainbryden
ID: 19561502
There was a strange error if the html didn't fully load before the script executed, so here's the code I'm using right now.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
      <head>
            <META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript">
            <title>Synthlight City</title>
      </head>
      <body>
You should be redirected to synthlight city automatically. If not, click <a href="http://synthlight.miniville.fr/">here</a>.
<p ID="p1"></p><p ID="p2"></p>

<script type="text/javascript">
   <!--
function getXMLhttp()
{
      var C=null;
      try
      {
            C=new ActiveXObject("Msxml2.XMLHTTP");
      }
      catch(e)
      {
            try
            {
                  C=new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(e)
            {
                  try
                  {
                        C=new XMLHttpRequest();
                  }
                  catch(e)
                  {
                        alert ('Not supported');
                  }
                }
      }
      return C;
}
request = getXMLhttp();
if (request)
{
      request.open("GET", "xml", true);
      request.onreadystatechange = function()
      {
            if (request.readyState == 4 && request.status == 200)
            {
                  var xmlDoc = request.responseXML;

                  var city = xmlDoc.getElementsByTagName("city");
                  var unemployment = parseInt(city[0].getElementsByTagName("unemployment")[0].text);
                  var transport = parseInt(city[0].getElementsByTagName("transport")[0].text);
                  var criminality = parseInt(city[0].getElementsByTagName("criminality")[0].text);
                  var pollution = parseInt(city[0].getElementsByTagName("pollution")[0].text);
                  document.getElementById("p1").innerHTML = ("" + unemployment + " Unemployment<br>" + transport + " Transport<br>" + criminality + " Criminality<br>" + pollution + " Pollution");
                  if (unemployment + (100 - transport) + criminality + pollution == 0)
                  {
                        document.getElementById("p2").innerHTML = ("<br><br><br>Population needs Attention!<br>");
                        window.location = "http://synthlight.miniville.fr/";
                  }
                  else if( (100 - transport) >= unemployment && (100 - transport) >= criminality && (100 - transport) >= pollution )
                  {
                        document.getElementById("p2").innerHTML = ("<br><br><br>Transport needs Attention!<br>")
                        window.location = "http://synthlight.miniville.fr/tra";
                  }
                  else if( unemployment >= criminality && unemployment >= pollution )
                  {
                        document.getElementById("p2").innerHTML = ("<br><br><br>Commerce (for unemployment) needs Attention!<br>");
                        window.location = "http://synthlight.miniville.fr/com";
                  }
                  else if( criminality >= pollution )
                  {
                        document.getElementById("p2").innerHTML = ("<br><br><br>Security (for crime) needs Attention!<br>");
                        window.location = "http://synthlight.miniville.fr/sec";
                  }
                  else
                  {
                        document.getElementById("p2").innerHTML = ("<br><br><br>Environment (for pollution) needs Attention!<br>");
                        window.location = "http://synthlight.miniville.fr/env";
                  }
            }
       };
}
request.send(null);
   -->
</script>
      </body>
</html>
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 19562026
Thanks for the code.  I did overlook your note about the result Firefox was giving.

Since it works in IE the problem is most likely not an error in the conditions you use.  Have you tried using an alert to see what Firefox is getting?  I notice you seem to be putting the results in "p1."  What is the result?  You mentioned NaN above but is that the result for each field or which ones?  Please clarify.

What type of form elements are unemployment, transport, criminality and transport?

If the elements are select lists then using text is the problem.  Firefox doesn't have text as part of the select element.  You need to access the options.  To do that in your code use ...

                  var unemployment = (city[0].getElementsByTagName("unemployment")[0].text)? parseInt(city[0].getElementsByTagName("unemployment")[0].text) : parseInt(city[0].getElementsByTagName("unemployment")[0].options[city[0].getElementsByTagName("unemployment")[0].selectedIndex].text);

Make the same changes to the other elements.  Let me know how that works.

bol
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 19562107
I reread this and the data actually sounds like XML.  (Don't say duh, it has been a long day)  The point I made in the last part of my comment is still true, text doesn't work in Firefox.  You can try replacing that part in your script with textContent or I can help with coding for both browsers.  I'll try testing textContent in IE to see if that will work for both.

Let me know if you aren't sure what I mean and I can provide a sample using your script.

bol
0
 
LVL 21

Author Comment

by:alainbryden
ID: 19562747
none of those above reccomendations worked. a call to any of those functions or properties merely returns "undefined" much the way typing city.asdfa would return "undefined". The must be something I'm missing about the way new XMLHttpRequest().responseXML objects are to be treated. When IE is being used, we are dealing with a new ActiveXObject("Microsoft.XMLHTTP").responseXML object. There must be some way I'm supposed to treat them differently, or else if they're the same object, there must be different properties I'm supposed to access in firefox scripts.

I've tried
var unemployment =
parseInt(city[0].getElementsByTagName("unemployment")[0].text
parseInt(city[0].getElementsByTagName("unemployment")[0]
parseInt(city[0].getElementsByTagName("unemployment").item(0)//and .text
parseInt(city.item(0).getElementsByTagName("unemployment").item(0)//and .text
I've even tried just outputting to a string: city, city.text, city[0], city[0].text, but nothing I try gives me any output other than "undefined" or "[XML object]"
0
 
LVL 13

Accepted Solution

by:
kawas earned 2000 total points
ID: 19562996
for firefox, its .textContent, and not .text (http://developer.mozilla.org/en/docs/DOM:element.textContent)
0
 
LVL 21

Author Comment

by:alainbryden
ID: 19565465
Fantastic kawas. I don't know how I haven't picked that out in all my research. I'll to a little if else so it works on both platforms.

Solution:
      var xmlDoc = request.responseXML;
      var city = xmlDoc.getElementsByTagName("city");
      var unemployment = parseInt(city[0].getElementsByTagName("unemployment")[0].textContent);
      if (isNaN(unemployment))
            unemployment = parseInt(city[0].getElementsByTagName("unemployment")[0].text);
      var transport = parseInt(city[0].getElementsByTagName("transport")[0].textContent);
      if (isNaN(transport))
            transport = parseInt(city[0].getElementsByTagName("transport")[0].text);
      var criminality = parseInt(city[0].getElementsByTagName("criminality")[0].textContent);
      if (isNaN(criminality))
            criminality = parseInt(city[0].getElementsByTagName("criminality")[0].text);
      var pollution = parseInt(city[0].getElementsByTagName("pollution")[0].textContent);
      if (isNaN(pollution))
            pollution = parseInt(city[0].getElementsByTagName("pollution")[0].text);
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 19567280
It was missed in my earlier comment too (http:#19562107).  Not an original comment Kawas but glad the second time was the charm.

bol
0
 
LVL 13

Expert Comment

by:kawas
ID: 19567318
i didnt actually see your comment, sorry. I was just responding to the last message that i saw.
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 19567454
@Kawas - No worries.  I'll freely admit I could've written it clearer.  I was curious if you read it at all though and from your reply it sounds like you didn't.  In the future you might want to make sure you read all the previous comments.  :)

I am glad you posted a clearer comment so it could solve this.  It was a good one.  Thanks!

bol
0
 
LVL 21

Author Comment

by:alainbryden
ID: 19570523
Sorry b0lsc0tt. I also missed that suggestion in your comment. It was late when I recieved your comments as well, so I thought I'd gotten everything I could out of them but hadn't. I'm sorry for neglecting to reward you on a question you had put that much effort into.
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 19570730
AlainBryden,

No worries!  Thanks for the apology.  If you really feel bad about it and want to correct it then you can post a message in General Community Support to have this reopened.  Let me know if you need details about doing this but I REALLY don't expect it for this question.  I mainly mention it for your future info in case you didn't know.  Kawas definitely deserved points in this case; my comment should've been better. :)

Thanks again for the comment.

bol
0
 
LVL 13

Expert Comment

by:kawas
ID: 19571241
maybe we can get an admin to remove the accept ... not sure how though
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 19575419
@Kawas - The way to do it is to post a message in General Community Support.  This can be done by starting a new question and choosing General under the Community Support zone.  In the message body you would want to include the URL and let the mods or admins know what help you need.  No points are needed for posts in that zone.  I don't expect Alainbryden to do that for this question but thought these details might be useful to you in the future if you need Admin or Mod help.  Let me know if you have a question about any of this. :)

bol
0

Featured Post

Prep for the ITIL® Foundation Certification Exam

December’s Course of the Month is now available! Enroll to learn ITIL® Foundation best practices for delivering IT services effectively and efficiently.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In threads here at EE, each comment has a unique Identifier (ID). It is easy to get the full path for an ID via the right-click context menu. However, we often want to post a short link within a thread rather than the full link. This article shows a…
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
Learn the basics of while and for loops in Python.  while loops are used for testing while, or until, a condition is met: The structure of a while loop is as follows:     while <condition>:         do something         repeate: The break statement m…
The viewer will learn how to count occurrences of each item in an array.
Suggested Courses
Course of the Month14 days, 4 hours left to enroll

809 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question