I am getting crazy. Can't access XML content in Firefox.

Hello sirs,

I am trying to send a POST request to a webservice on the click of a
button. This will return me an XML document with a list of combo box
items.

The problem: in FIREFOX, when the get the XmlDocument from the
XmlHttpRequest object, I can't access its contents. I keep getting
empty strings and "null".

This is my code:

---

function GetComboBoxItems(p_strType, p_strCode)
{
var objParameters = new Array();
objParameters[0] = p_strType;
objParameters[1] = p_strCode;

var objHttpRequest =
SendRequest("/MeuWebService/MyWebService.asmx/GetComboBoxItems",
objParameters);

alert(objHttpRequest.responseText); // alerts the XML doc (see
below)

/*

this is the XML document:

<?xml version="1.0" enconding="utf-8"?>
<ReturnDocument>
<ComboItem>
<Key>1</Key>
<Description>My first item</Description>
</ComboItem>
<ComboItem>
<Key>2</Key>
<Description>My second item</Description>
</ComboItem>
</ReturnDocument>

*/

alert(objHttpRequest.responseXML); // alerts '[object XMLDocument]'

var XmlDoc = objHttpRequest.responseXML;

var arrTemp =
XmlDoc.documentElement.getElementsByTagName("Combo Item");

alert(arrTemp.length); // alerts '2'

// show contents (Firefox)
for(var i = 0; i < arrTemp.length; i++)
{
alert(arrTemp[i].childNodes[0].nodeValue); // alerts empty string
alert(arrTemp[i].childNodes[1].nodeValue); // alerts 'null'
}

/*
// show contents (IE) - works perfectly
for(var i = 0; i < arrTemp.length; i++)
{
alert(arrTemp[i].childNodes[0].text);
alert(arrTemp[i].childNodes[1].text);
alert(arrTemp[i].childNodes[2].text);
} */
}


---

I searched everywhere for a logic explanation, but couldn't find any.

In IE it works perfectly. What am I doing wrong?


TIA,
Leonardo

What is SendRequest() ?

I don't see this function in your code.
Or are you trying to use Microsoft C# SendRequest() on Mozilla?

VK,

SendRequest is a custom function.

function SendRequest(p_strURL, p_arrParameters)
{
try
{
// Firefox
xmlRequest = new XMLHttpRequest();
}
catch(ex)
{
try
{
//IE
xmlRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(ex)
{
xmlRequest = false;
}
}

// POST request
xmlRequest.open("POST", p_strURL, false);
xmlRequest.setRequestHeader("Content-Type",
"application/x-www-form-urlencoded");

var strParameters = "";
for(var strKey in p_arrParameters)
{
if(strParameters == "")
{
strParameters += "p_arrParametros=" +
p_arrParameters[strKey];
}
else
{
strParameters += "&p_arrParametros=" +
p_arrParameters[strKey];
}
}

xmlRequest.send(strParameters);

return xmlRequest;
}



But.. I found out the problem!

When I do :

var arrTemp =
XmlDoc.documentElement.getElem*entsByTagName("Comb oItem");

I have arrTemp with 2 items. That's correct, I have 2 elements in my
XML.

Now, inside each of these "ComboItem", I have 2 items ("Key" and
"Description") in Internet explorer and 5 items ("Key", "Description"
and others) in Firefox.

I still doesn't understand this difference, but at least now I can get
the contents that I need. I do a for loop checking for nodeName. If
it's "Key" or "Description" I get the nodeValue of the firstChild node.

Thanks for the help!

leodippolito@gmail.com wrote:

[color=blue]
> <?xml version="1.0" enconding="utf-8"?>
> <ReturnDocument>
> <ComboItem>
> <Key>1</Key>
> <Description>My first item</Description>
> </ComboItem>
> <ComboItem>
> <Key>2</Key>
> <Description>My second item</Description>
> </ComboItem>
> </ReturnDocument>
>
> */
>
> alert(objHttpRequest.responseXML); // alerts '[object XMLDocument]'
>
> var XmlDoc = objHttpRequest.responseXML;
>
> var arrTemp =
> XmlDoc.documentElement.getElementsByTagName("Combo Item");
>
> alert(arrTemp.length); // alerts '2'[/color]

So you can access the contents.
[color=blue]
> alert(arrTemp[i].childNodes[0].nodeValue); // alerts empty string[/color]

The first child node is a text node with whitespace, so that is what you
see.
[color=blue]
> alert(arrTemp[i].childNodes[1].nodeValue); // alerts 'null'[/color]

The second child nodes is the <Key> element node, element nodes do not
have a helpful nodeValue, so the null is all you get.

Instead of accessing the childNodes where you can get all kind of nodes
like text nodes, comment nodes, and that differs between browsers or
parser settings I strongly suggest to use getElementsByTagName if you
are looking for an element e.g.
var comboItems =
objHttpRequest.responseXML.documentElement.getElem entsByTagName('ComboItem');
for (var i = 0; i < comboItems.length; i++) {
var comboItem = comboItems[i];
var key = comboItem.getElementsByTagName('Key').item(0);
var description =
comboItem.getElementsByTagName('Description').item (0);
}
Now you have the element nodes and need to decide what information you
want, as you have seen MSXML in IE gives the whole text content with the
text property; Firefox has a similar property named textContent but
earlier versions of Mozilla do not implement that property; Opera so far
does not implement it either so in my view on the web it is best to
write a short helper function to collect text information e.g.

function getInnerText (node) {
if (typeof node.textContent != 'undefined') {
return node.textContent;
}
else if (typeof node.innerText != 'undefined') {
return node.innerText;
}
else if (typeof node.text != 'undefined') {
return node.text;
}
else {
switch (node.nodeType) {
case 3:
case 4:
return node.nodeValue;
break;
case 1:
case 11:
var innerText = '';
for (var i = 0; i < node.childNodes.length; i++) {
innerText += getInnerText(node.childNodes[i]);
}
return innerText;
break;
default:
return '';
}
}
}

Then in the above for loop you could use

var comboItem = comboItems[i];
var key = comboItem.getElementsByTagName('Key').item(0);
if (key) {
alert('Key has content: ' + getInnerText(key));
}
var description =
comboItem.getElementsByTagName('Description').item (0);
if (description) {
alert('Description has content: ' + getInnerText(description));
}

and that is going to work with all Mozilla browsers, with IE/Win using
MSXML, with Opera 8.
--

Martin Honnen
http://JavaScript.FAQTs.com/

Thanks a lot Martin!

You saved my sanity :)

[]s