parsing the xml returned from ajax call

[Lee Sha]

Hi,
I am trying to parse the below xml string passed from the servlet:

<messages>
<messages>
<id>TATASCR</id>
<lname>Sha</lname>
<fname>Lee</fname>
</messages>
</messages>

using the code:

xmlHttp.onreadystatechange = function() {
 
var str = "<TABLE>";
if(xmlHttp.readyState == 4) {
 
var messages = xmlHttp.responseXML.getElementByTagName("messages");
 

for (var loop = 0; loop < messages.childNodes.length(); loop++) {
var message = messages.childNodes[loop];
str = str + "<TR><TD>"+message.getElementsByTagName("id")[0]+"</TD>";
str = str + "<TD>"+message.getElementsByTagName("lname")[0]+"</TD>";
str = str + "<TD>"+message.getElementsByTagName("fname")[0]+"</TD></TR>";
}
 
str = str + "</TABLE>";
 
}
}

But xmlHttp.responseXML does not work. Can anyone tell me what is the problem?
[ April 21, 2008: Message edited by: Lee Sha ]

[Bear Bibeault]

Originally posted by Lee Sha:
But xmlHttp.responseXML does not work. Can anyone tell me what is the problem

"does not work" doesn't tell us what the problem is. What does "does not work" mean?

Also, please be sure to use UBB code tags when posting code to the forums. Unformatted code is extremely hard to read and many people that might be able to help you will just move along. Please read this for more information.

You can go back and change your post to add code tags by clicking the .

[Lee Sha]

xmlHttp.responseXML does not give me the xml which is passed from the servlet.

[Bear Bibeault]

How do you know? I'm not doubting you, but it would be instructive to know what your evidence is in order to help diagnose the problem.

Some things to always check: is the content type of the response correct? Is the XML well-formed with the <?xml?> header line?

[Lee Sha]

Oh. I don't know about that. The only string which the servlet builds is this -

<messages><message><id>TATASCR</id><lname>Sha</lname><fname>Lee</fname></message></messages>

Can you tell me what I have to append to this string before passing it to the html page?

[Paul Clapham]

That looks like well-formed XML to me. But you don't pass it to the HTML page (whatever you meant by that), all you have to do is return it as the response to the AJAX request.

[Lee Sha]

Yes. That is what I did. I passed it as a response to xmlHttp request.

[Paul Clapham]

Okay. So then, what is the value of xmlHttp.responseXML once it actually gets the response?

(If it were up to me I would just send the table as a table instead of sending something else and having Javascript turn it into a table. But there may be good reasons for doing what you are doing.)

[Eric Pascarello]

Originally posted by Paul Clapham:
That looks like well-formed XML to me. But you don't pass it to the HTML page (whatever you meant by that), all you have to do is return it as the response to the AJAX request.

That does not look like it to me. it is missing the <xml....> which Bear pointed out.

Links that may help:
http://www.w3schools.com/xml/xml_tree.asp
http://radio.javaranch.com/pascarello/2006/09/12/1158096122600.html

Eric

[Lee Sha]

Now this is what the XML string which is passed as response to xmlHttp request object:

<?xml version="1.0" encoding="ISO-8859-1"?><messages><message><id>TATASCR</id><lname>Cheriyil</lname><fname>Samal</fname></message></messages>

Still, I do not receive it in xmlHttp.responseXML

[Lee Sha]

I tried using xmlHttp.responseXML.xml and now it has the xml string which is passed as a response. I get a script error when I do the below operation on it:

   var mess = xmlHttp.responseXML.xml;
   var messages = mess.getElementsByTagName("messages"); //throws script error

Can anyone tell me what I am missing here?

[Bear Bibeault]

You still haven't answered my question regarding content type.

[Lee Sha]

I set the content type as "text/xml"

[Vilmantas Baranauskas]

I had such problem several times. It was the wrong content type in every single case.

Double-check the content type of the response.

[Lee Sha]

I checked it. I set the content type in the servlet code as below:

    response.setContentType("text/xml");

[Eric Pascarello]

Did you read this:

http://radio.javaranch.com/pascarello/2006/09/12/1158096122600.html

Eric

[Lee Sha]

I guess I followed all the steps which you have listed. I can get the responseXML, but I have problem only when I try to parse it. In the below piece of code, I have given comment where it throws script error.

xmlHttp.onreadystatechange = function(){
 
var str = "<TABLE>";
 
if(xmlHttp.readyState == 4) {
 
var mess = xmlHttp.responseXML.xml;//WORKS TILL HERE
var messages = mess.getElementsByTagName("messages");//THROWS SCRIPT ERROR
var mdiv = document.getElementById("userIdMessage");
 
for (var loop = 0; loop < messages.childNodes.length(); loop++) {
var message = messages.childNodes[loop];
str = str + "<TR><TD>"+message.getElementsByTagName("id")[0]+"</TD>";
str = str + "<TD>"+message.getElementsByTagName("lname")[0]+"</TD>";
str = str + "<TD>"+message.getElementsByTagName("fname")[0]+"</TD></TR>";
}
 
str = str + "</TABLE>";
mdiv.innerHTML = str;
}
}

Can you confirm if I am parsing it properly?

[Vilmantas Baranauskas]

I've saved your XML into a.xml file and then make AJAX request to the static a.xml file. Following code works fine for response processing:

            if (ajaxRequest.readyState == 4) {
               if (ajaxRequest.status == 200) {
                  var xmlResponse = ajaxRequest.responseXML;
 
                   var messages = xmlResponse.getElementsByTagName("messages");
 
                   for (i = 0; i < messages.length; i++) {
                       var message = messages[i];
                       alert(message.getElementsByTagName("id")[0].firstChild.data)
                   }
 
               } else {
                   alert("Cannot load data!");
               }
            }

BTW, invoking response.setContentType("text/xml") does not guarantee that content type will be correct. I suggest using Firefox with LiveHTTPHeaders plugin to see if the content type is really correct.

[Lee Sha]

I am trying this with IE. With which browser did you try it?

[Vilmantas Baranauskas]

I've used Firefox.

BTW, I recommend to rename your second "messages" tag to "message".

<messages>
<message>
<id>TATASCR</id>
<lname>Sha</lname>
<fname>Lee</fname>
</message>
</messages>

[Eric Pascarello]

also you should not have

responseXML.xml

it should be

responseXML.document

Eric

[Lee Sha]

Thanks for all your suggestions. This is the final code which worked both in Firefox and IE.

xmlHttp.onreadystatechange = function(){
 
var str = "<TABLE>";
if(xmlHttp.readyState == 4) {
 
var mdiv = document.getElementById("userIdMessage");
 
var text = xmlHttp.responseText;
 

try { //Internet Explorer
  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
  xmlDoc.async="false";
  xmlDoc.loadXML(text);
  } catch(e) {
  try { //Firefox, Mozilla, Opera, etc.
    parser=new DOMParser();
xmlDoc=parser.parseFromString(text,"text/xml");
    } catch(e) {
    alert(e.message)
    }
}
 
var messages = xmlDoc.getElementsByTagName("messages")[0];
 
var message;
 
for (var i = 0; i < messages.childNodes.length; i++) {
message = messages.getElementsByTagName("message")[i];
str = str + "<TR><TD>"+message.getElementsByTagName("id")[0].childNodes[0].nodeValue+"</TD>";
str = str + "<TD>"+message.getElementsByTagName("lname")[0].childNodes[0].nodeValue+"</TD>";
str = str + "<TD>"+message.getElementsByTagName("fname")[0].childNodes[0].nodeValue+"</TD></TR>";
}
 
str = str + "</TABLE>";
mdiv.innerHTML = str;
 
}
}

[Bear Bibeault]

Whew! Now that that's all over with... in the future you might want to consider JSON as a data exchange format which is much easier to digest in JavaScript.