Ajax code works in IE but not in Mozilla

Hi experts,

I'v got a problem I can't fugure out. I wrote a script that should load webcontent into a predefined div. Now the script works fine in IE, but on Moz I only receive an error stating the object variable has no properties. I can't figure out what goes wrong.

I've tried to load the webcontent separately and it worked fine in Moz and IE. So there seems to be no problem with the xml/html syntax.

My (Dutch) website: http://www.autentiek.nl

Below there is a snipplet of my javascript file that deals with loading xml-documents and I included a xml-file example.

function createXMLDOMObject() {
	var xmldom = false;
  var XMLDOMFlavours=[
    function () {return new ActiveXObject("MSXML2.DOMDocument.6.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument.5.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument.4.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument.3.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument")},
    function () {return new ActiveXObject("Microsoft.XMLDOM")},
    function () {return document.implementation.createDocument("","",null)}
  ];
 
	for (var i=0;i<XMLDOMFlavours.length;i++) {
		try {
			xmldom = XMLDOMFlavours[i]();
		} catch (e) {
			continue;
		}
		break;
	}
	return xmldom;
}
 
function loadXMLDoc(url,txtBlock,xmlRoot) {
  var xmlDoc, xmlContent, tmp, i, j, f;
  var container=(txtBlock)?getObjectID(txtBlock):getObjectID("content_main");
 
  container.innerHTML='<div class="item"><img src="images/onemoment.gif">&nbsp;&nbsp;Pagina ' +
                      xlink(url) + ' wordt geladen...</div>';
 
  if (!xmlRoot) xmlRoot="pagina";
  var startTag='<' + xmlRoot + ' xmlns="http://www.w3.org/1999/xhtml">';
  var endTag="</" + xmlRoot + ">";
  try {
    xmlDoc=createXMLDOMObject();
    xmlDoc.async=false;
    xmlDoc.load(url);
    xmlContent=xmlDoc.documentElement;
    if (!xmlContent.xml) {                         // <<< fails in Moz here
      xmlContent=xmlContent.innerHTML;
    } else {
      xmlContent=xmlContent.xml;
      xmlContent=xmlContent.replace(startTag,"");
      xmlContent=xmlContent.replace(endTag,"");
    }
    while (xmlContent.indexOf("js:{") > -1) {
      i=xmlContent.indexOf("js:{");
      j=xmlContent.indexOf("}:js");
      f=xmlContent.substring(i+4,j);
      tmp=eval(f);
      xmlContent=xmlContent.substring(0,i)+tmp+xmlContent.substring(j+4);
    }
  } catch(err) {
    setDocumentTitle("Pagina kan niet worden geladen");
   //This is a self created error page
    xmlContent='<div class="item">' +
               '  <h1 style="font-size:14pt;color:#FF0033;">Pagina kan niet worden geladen</h1>' +
               '  <div class="linemarker">'+
               '    <img src="images/error_shield_xs.png" alt="error" />' +
               '  </div>' +
               '  <p style="color:#0026FF;font-family:Verdana, Arial, Helvetica, sans-serif;font-size:10pt;text-align:left;">' +
               '    Er heeft zich een fout voorgedaan bij het laden van deze pagina. ' +
               '    Meld dit a.u.b. aan de <a href="javascript:sendMail(1);">systeemadministrator</a> van autentiek.nl.' +
               '  </p>' +
               '  <hr />' +
               '  <address style="color:#0026FF;font-size:10pt;text-align:left;">' +
               '    Web Server at autentiek.nl - Hosted by <a href="http://www.alphamegahosting.com">Alphamega</a>' +
               '  </address>' +
               '</div>';
  }
  if (resultContainsTags(xmlContent) && container.innerHTML) container.innerHTML=xmlContent;
  else container.innerText=xmlContent;
}
====================================================
<?xml version="1.0" encoding="ISO-8859-1" ?>
 
<pagina xmlns="http://www.w3.org/1999/xhtml">
  <div class="item">
    Some text for the website...
  </div>
</pagina>

Open in new window

LVL 3
CvDAsked:
Who is Participating?
 
Michel PlungjanConnect With a Mentor IT ExpertCommented:
And this works with the welcome page you have

<html>
<head>
<script>
var container;
function createXMLDOMObject() {
        var xmldom = false;
  var XMLDOMFlavours=[
    function () {return new ActiveXObject("MSXML2.DOMDocument.6.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument.5.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument.4.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument.3.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument")},
    function () {return new ActiveXObject("Microsoft.XMLDOM")},
    function () {return document.implementation.createDocument("","",null)}
  ];
 
        for (var i=0;i<XMLDOMFlavours.length;i++) {
                try {
                        xmldom = XMLDOMFlavours[i]();
                } catch (e) {
                        continue;
                }
                break;
        }
        return xmldom;
}
function getObjectID(id) {
  var obj = document.getElementById(id);
  return obj?obj:null;
} 
function xlink(url) {
  return '<a href="'+url+'">'+url+'</a>'
}
function resultContainsTags(str) {
  return str.indexOf('<')!=-1
}
function setDocumentTitle(str) {
  document.title=str;
  return str;
}
function age(str) {
  return str
}
function loadXMLDoc(url,txtBlock,xmlRoot) {
  var xmlDoc, xmlContent, tmp, i, j, f;
  container=(txtBlock)?getObjectID(txtBlock):getObjectID("content_main");
  container.innerHTML='<div class="item"><img src="images/onemoment.gif">  Pagina ' +
                      xlink(url) + ' wordt geladen...</div>';
 
  if (!xmlRoot) xmlRoot="pagina";
  var startTag='<' + xmlRoot + ' xmlns="http://www.w3.org/1999/xhtml">';
  var endTag="</" + xmlRoot + ">";
  try {
    xmlDoc=createXMLDOMObject();
    xmlDoc.async=false;
    xmlDoc.load(url);
    var docElement=xmlDoc.documentElement;
 
    if (!docElement.xml) {                         // <<< fails in Moz here
      xmlContent=docElement.innerHTML;
      
    } else {
      xmlContent=docElement.xml;
      xmlContent=xmlContent.replace(startTag,"");
      xmlContent=xmlContent.replace(endTag,"");
    }
    while (xmlContent.indexOf("js:{") > -1) {
      i=xmlContent.indexOf("js:{");
      j=xmlContent.indexOf("}:js");
      f=xmlContent.substring(i+4,j);
      tmp=eval(f);
      xmlContent=xmlContent.substring(0,i)+tmp+xmlContent.substring(j+4);
    }
  } catch(err) {
    setDocumentTitle("Pagina kan niet worden geladen");
   //This is a self created error page
    xmlContent='<div class="item">' +
               '  <h1 style="font-size:14pt;color:#FF0033;">Pagina kan niet worden geladen</h1>' +
               '  <div class="linemarker">'+
               '    <img src="images/error_shield_xs.png" alt="error" />' +
               '  </div>' +
               '  <p style="color:#0026FF;font-family:Verdana, Arial, Helvetica, sans-serif;font-size:10pt;text-align:left;">' +
               '    Er heeft zich een fout voorgedaan bij het laden van deze pagina. ' +
               '    Meld dit a.u.b. aan de <a href="javascript:sendMail(1);">systeemadministrator</a> van autentiek.nl.' +
               '  </p>' +
               '  <hr />' +
               err.message+
               '  <hr />' +
               '  <address style="color:#0026FF;font-size:10pt;text-align:left;">' +
               '    Web Server at autentiek.nl - Hosted by <a href="http://www.alphamegahosting.com">Alphamega</a>' +
               '  </address>' +
               '</div>';
  }
  if (resultContainsTags(xmlContent) && container.innerHTML) container.innerHTML=xmlContent;
  else container.innerText=xmlContent;
}
window.onload=function() {
  loadXMLDoc("testxml1.xml","","pagina");
}
</script>
</head>
<body>
<div id="content_main"> 
</div>
</body>
</html>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
try using miniajax from google code instead.

Seems you are being far too complex for such a simple thing
0
 
CvDAuthor Commented:
Be it as it may,your solutions doesn't worfor me. I used this script because I want to execute javascript which is called from the websites that are loaded. And when you load a webpage through AJAX it will only render, but no execute scripts. So I deviced a trick. A javascript is called upon between the markers js:{ and }:js. Just before writing the webcontent the script is evaluated and the markers and the content between them are erased. After that has been done, the page content is shown. I couldn't find another way to do this.

Coming back to my original question... Why is Moz not loading my webpages. I keep getting the message "xmlContent has no properties". Upto the phrase "if (!xmlContent.xml) {" all works like a charm in both IE and Moz. As soon as the if statement is executed in Moz, I receive the error.
0
Get your problem seen by more experts

Be seen. Boost your question’s priority for more expert views and faster solutions

 
Michel PlungjanIT ExpertCommented:
Is the data returned to the browser valid XML according to the browser? With your preamble, I think it is not
0
 
CvDAuthor Commented:
When I load the page into the Moz browser separately, it is shown correctly. No errors whats however are shown in the error console. No indication that something is wrong. Thats why I'm puzzled.
0
 
Michel PlungjanIT ExpertCommented:
But is it XML???
0
 
CvDAuthor Commented:
Although I knew it wouldn't make a difference I followed your lead an stripped all exotic thing from my welcome page. Only plain xhtml code.
I validated the content: no errors.
I saved it to my website and reloaded the pages in a new browser session so no caching would be in the way.
Alas, same result. Works like a charm in IE but not in Moz. Same error.
0
 
CvDAuthor Commented:
I see waht your getting at, but it being XML does not seem to be the problem. I thought it at first as well. So I used the html declaration and reloaded the page. Same result. Then I used no declaration at all, just plain html content as from <div class="item">. Again, same result.

Mind you, I'm no expert at x(h)tml, but when Moz validates the content when I load it separately, I suspect it must be ok, since Moz is quit particular about the w3 rules.
0
 
Michel PlungjanIT ExpertCommented:
This works with the test xml you posted

<html>
<head>
<script>
function createXMLDOMObject() {
        var xmldom = false;
  var XMLDOMFlavours=[
    function () {return new ActiveXObject("MSXML2.DOMDocument.6.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument.5.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument.4.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument.3.0")},
    function () {return new ActiveXObject("MSXML2.DOMDocument")},
    function () {return new ActiveXObject("Microsoft.XMLDOM")},
    function () {return document.implementation.createDocument("","",null)}
  ];
 
        for (var i=0;i<XMLDOMFlavours.length;i++) {
                try {
                        xmldom = XMLDOMFlavours[i]();
                } catch (e) {
                        continue;
                }
                break;
        }
        return xmldom;
}
function getObjectID(id) {
  var obj = document.getElementById(id);
  alert(id+':'+obj)
  return obj?obj:null;
} 
function xlink(url) {
  return '<a href="'+url+'">'+url+'</a>'
}
function resultContainsTags(str) {
  return str.indexOf('<')!=-1
}
function loadXMLDoc(url,txtBlock,xmlRoot) {
  var xmlDoc, xmlContent, tmp, i, j, f;
  var container=(txtBlock)?getObjectID(txtBlock):getObjectID("content_main");
alert(container) 
  container.innerHTML='<div class="item"><img src="images/onemoment.gif">  Pagina ' +
                      xlink(url) + ' wordt geladen...</div>';
 
  if (!xmlRoot) xmlRoot="pagina";
  var startTag='<' + xmlRoot + ' xmlns="http://www.w3.org/1999/xhtml">';
  var endTag="</" + xmlRoot + ">";
  try {
    xmlDoc=createXMLDOMObject();
    xmlDoc.async=false;
    xmlDoc.load(url);
    xmlContent=xmlDoc.documentElement;
    if (!xmlContent.xml) {                         // <<< fails in Moz here
      xmlContent=xmlContent.innerHTML;
    } else {
      xmlContent=xmlContent.xml;
      xmlContent=xmlContent.replace(startTag,"");
      xmlContent=xmlContent.replace(endTag,"");
    }
    while (xmlContent.indexOf("js:{") > -1) {
      i=xmlContent.indexOf("js:{");
      j=xmlContent.indexOf("}:js");
      f=xmlContent.substring(i+4,j);
      tmp=eval(f);
      xmlContent=xmlContent.substring(0,i)+tmp+xmlContent.substring(j+4);
    }
  } catch(err) {
    setDocumentTitle("Pagina kan niet worden geladen");
   //This is a self created error page
    xmlContent='<div class="item">' +
               '  <h1 style="font-size:14pt;color:#FF0033;">Pagina kan niet worden geladen</h1>' +
               '  <div class="linemarker">'+
               '    <img src="images/error_shield_xs.png" alt="error" />' +
               '  </div>' +
               '  <p style="color:#0026FF;font-family:Verdana, Arial, Helvetica, sans-serif;font-size:10pt;text-align:left;">' +
               '    Er heeft zich een fout voorgedaan bij het laden van deze pagina. ' +
               '    Meld dit a.u.b. aan de <a href="javascript:sendMail(1);">systeemadministrator</a> van autentiek.nl.' +
               '  </p>' +
               '  <hr />' +
               '  <address style="color:#0026FF;font-size:10pt;text-align:left;">' +
               '    Web Server at autentiek.nl - Hosted by <a href="http://www.alphamegahosting.com">Alphamega</a>' +
               '  </address>' +
               '</div>';
  }
  if (resultContainsTags(xmlContent) && container.innerHTML) container.innerHTML=xmlContent;
  else container.innerText=xmlContent;
}
window.onload=function() {
  loadXMLDoc("testxml.xml","","pagina");
}
</script>
</head>
<body>
<div id="content_main"> 
</div>
</body>
</html>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
The error is that xmlContent was read-only and you reused the variable name
0
 
Michel PlungjanIT ExpertCommented:
Jij ben welkom op mijn homepagina (zie profile)
0
 
CvDAuthor Commented:
I made the necessary modifications, but now I get different errors in Moz.

Locally I get the error message: Access to restricted URI denied
Remotely I get the error message docElement is null

Any clues?
0
 
Michel PlungjanIT ExpertCommented:
What browser version and platform?

The code I posted works for me in FF 3.0.7 on XP with the xml in the same directory.
0
 
CvDAuthor Commented:
Firefox 3.0.8 on Windows Vista x64 Ultimate.

Complete description from Moz about box:
Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.0.8) Gecko/2009032609 Firefox/3.0.8 (.NET CLR 3.5.30729)
0
 
CvDAuthor Commented:
Oh, I forgot... the html pages are in a subdirectory from the root where index.html is located, called html.
The pages are referenced "html/somepage.html" (f.e. html/welkom.html).
0
 
CvDAuthor Commented:
Found one thing...

The line            xmlDoc.load(url);
Should state     xmlDoc.load(xlink(url));

But unfortunately this leaves me locally and remotely with the error message docElement is null.
0
 
Michel PlungjanIT ExpertCommented:
I know - I am looking
0
 
Michel PlungjanIT ExpertCommented:
Works

http://plungjan.name/eetest/test1.html

I renamed to welkom.xml as it should be called

Please note I call my html dir for ajax
0
 
Michel PlungjanIT ExpertCommented:

PS: I believe it is called autisme:  "begeleiding, ondersteuning en advies bij autsime"

Or is this to catch spelling errors?
0
 
CvDAuthor Commented:
Thanks on the typo, hadn't seen that yet.

I renamed to html/welkom.xml and it did the trick.
Ok, I  would not have figured that out so fast. Quite redigulous though, that the extention is the bottleneck. One whould expect the content of a file is decisive and not the extent.

Anyway, thanks a bundle. Points well earned.
0
 
Michel PlungjanIT ExpertCommented:
It is your server that sets the content type to text/html based on the extension, Firefox cannot really be faulted for listening to the content type header and the extension
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.