Please check the below code, it's working fine in Firefox but not working in internet explorer.
Can any one please help me on this?
HTML file: (finaltest.html)
<html>
<head>
<title>This is testing</title>
<script type="text/javascript">
var items= new Array();
var details = new Array();
var contents = new Array();
function allCall()
{
readXMLUsingXPATH();
populateList();
}
function populateList()
{
for(var list=0; list<items.length; list++){
var temp= new Option(items[list],items[list]);
document.getElementById('sel').options.add(temp);
//alert("in populatelist");
}
}
function addContent(divName, content)
{
//alert(content);
document.getElementById(divName).innerHTML = content;
}
function loadXML(){
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Micrsoft.XMLHTTP");
}
xmlhttp.open("GET","details.xml",false);
xmlhttp.send();
return xmlhttp.responseXML;
}
function readXMLUsingXPATH(){
var xmlDoc = loadXML();
if(xmlDoc == null){
alert("XML HTTP object is null");
return;
}
var path1 = "/Root/Item/name";
var path2 = "/Root/Item/details";
var path3 = "/Root/Item/content";
var xmlNoadList1,xmlNoadList2,xmlNoadList3,result1,result2,result3,name,detail,content,list;
if(window.ActiveXObject){
xmlNoadList1 = xmlDoc.selectNodes(path1);
xmlNoadList2 = xmlDoc.selectNodes(path2);
xmlNoadList3 = xmlDoc.selectNodes(path3);
for(list=0; list<xmlNoadList1.length; list++){
items[list]=xmlNoadList1[list].childNodes[0].nodeValue;
name = xmlNoadList1[list].childNodes[0].nodeValue;
}
for(list=0; list<xmlNoadList2.length; list++){
details[list]=xmlNoadList2[list].childNodes[0].nodeValue;
detail = xmlNoadList2[list].childNodes[0].nodeValue;
}
for(list=0; list<xmlNoadList3.length; list++){
contents[list]=xmlNoadList3[list].childNodes[0].nodeValue;
content = xmlNoadList3[list].childNodes[0].nodeValue;
}
}
else if(document.implementation && document.implementation.createDocument){
xmlNoadList1 = xmlDoc.evaluate(path1, xmlDoc, null, XPathResult.ANY_TYPE, null);
xmlNoadList2 = xmlDoc.evaluate(path2, xmlDoc, null, XPathResult.ANY_TYPE, null);
xmlNoadList3 = xmlDoc.evaluate(path3, xmlDoc, null, XPathResult.ANY_TYPE, null);
result1 = xmlNoadList1.iterateNext();
result2 = xmlNoadList2.iterateNext();
result3 = xmlNoadList3.iterateNext();
list=0;
while(result1){
name = result1.childNodes[0].nodeValue;
items[list]=result1.childNodes[0].nodeValue;
result1 = xmlNoadList1.iterateNext();
list++;
}
list=0;
while(result2){
detail = result2.childNodes[0].nodeValue;
details[list]=result2.childNodes[0].nodeValue;
result2 = xmlNoadList2.iterateNext();
list++;
}
list=0;
while(result3){
content = result3.childNodes[0].nodeValue;
contents[list]=result3.childNodes[0].nodeValue;
result3 = xmlNoadList3.iterateNext();
list++;
}
}
//alert("in xml");
}
function itemDetails(name,ind){
//alert(details[ind]);
document.getElementById(name).innerHTML = details[ind] + "</br>" + contents[ind];
}
</script>
</head>
<body >
<form name="myForm">
Content to be added:
<SELECT name="sel" id="sel" size="4" onChange="addContent('result', this[this.selectedIndex].text);">
</SELECT>
<input type="button" value="Details" onClick="itemDetails('result', document.getElementById('sel').selectedIndex)">
</form>
<br><br>
Your content will be added dynamically below:
<div id="result"></div>
<script type="text/javascript">
onload=allCall;
</script>
</body>
</html>
XML file: (details.xml)
<?xml version="1.0" encoding="utf-8"?>
<Root>
<Item>
<name>Item1</name>
<details>Item1 Details</details>
<content>Item1 Content</content>
</Item>
<Item>
<name>Item2</name>
<details>Item2 Details</details>
<content>Item2 Content</content>
</Item>
<Item>
<name>Item3</name>
<details>Item3 Details</details>
<content>Item3 Content</content>
</Item>
<Item>
<name>Item4</name>
<details>Item4 Details</details>
<content>Item4 Content</content>
</Item>
<Item>
<name>Item5</name>
<details>Item5 Details</details>
<content>Item5 Content</content>
</Item>
<Item>
<name>Item6</name>
<details>Item6 Details</details>
<content>Item6 Content</content>
</Item>
<Item>
<name>Item7</name>
<details>Item7 Details</details>
<content>Item7 Content</content>
</Item>
<Item>
<name>Item8</name>
<details>Item8 Details</details>
<content>Item8 Content</content>
</Item>
</Root>
Please check the below code, it's working fine in Firefox but not working in internet explorer.
Can any one please help me on this?
HTML file: (finaltest.html)
<html>
<head>
<title>This is testing</title>
<script type="text/javascript">
var items= new Array();
var details = new Array();
var contents = new Array();
function allCall()
{
readXMLUsingXPATH();
populateList();
}
function populateList()
{
for(var list=0; list<items.length; list++){
var temp= new Option(items[list],items[list]);
document.getElementById('sel').options.add(temp);
//alert("in populatelist");
}
}
function addContent(divName, content)
{
//alert(content);
document.getElementById(divName).innerHTML = content;
}
function loadXML(){
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Micrsoft.XMLHTTP");
}
xmlhttp.open("GET","details.xml",false);
xmlhttp.send();
return xmlhttp.responseXML;
}
function readXMLUsingXPATH(){
var xmlDoc = loadXML();
if(xmlDoc == null){
alert("XML HTTP object is null");
return;
}
var path1 = "/Root/Item/name";
var path2 = "/Root/Item/details";
var path3 = "/Root/Item/content";
var xmlNoadList1,xmlNoadList2,xmlNoadList3,result1,result2,result3,name,detail,content,list;
if(window.ActiveXObject){
xmlNoadList1 = xmlDoc.selectNodes(path1);
xmlNoadList2 = xmlDoc.selectNodes(path2);
xmlNoadList3 = xmlDoc.selectNodes(path3);
for(list=0; list<xmlNoadList1.length; list++){
items[list]=xmlNoadList1[list].childNodes[0].nodeValue;
name = xmlNoadList1[list].childNodes[0].nodeValue;
}
for(list=0; list<xmlNoadList2.length; list++){
details[list]=xmlNoadList2[list].childNodes[0].nodeValue;
detail = xmlNoadList2[list].childNodes[0].nodeValue;
}
for(list=0; list<xmlNoadList3.length; list++){
contents[list]=xmlNoadList3[list].childNodes[0].nodeValue;
content = xmlNoadList3[list].childNodes[0].nodeValue;
}
}
else if(document.implementation && document.implementation.createDocument){
xmlNoadList1 = xmlDoc.evaluate(path1, xmlDoc, null, XPathResult.ANY_TYPE, null);
xmlNoadList2 = xmlDoc.evaluate(path2, xmlDoc, null, XPathResult.ANY_TYPE, null);
xmlNoadList3 = xmlDoc.evaluate(path3, xmlDoc, null, XPathResult.ANY_TYPE, null);
result1 = xmlNoadList1.iterateNext();
result2 = xmlNoadList2.iterateNext();
result3 = xmlNoadList3.iterateNext();
list=0;
while(result1){
name = result1.childNodes[0].nodeValue;
items[list]=result1.childNodes[0].nodeValue;
result1 = xmlNoadList1.iterateNext();
list++;
}
list=0;
while(result2){
detail = result2.childNodes[0].nodeValue;
details[list]=result2.childNodes[0].nodeValue;
result2 = xmlNoadList2.iterateNext();
list++;
}
list=0;
while(result3){
content = result3.childNodes[0].nodeValue;
contents[list]=result3.childNodes[0].nodeValue;
result3 = xmlNoadList3.iterateNext();
list++;
}
}
//alert("in xml");
}
function itemDetails(name,ind){
//alert(details[ind]);
document.getElementById(name).innerHTML = details[ind] + "</br>" + contents[ind];
}
</script>
</head>
<body >
<form name="myForm">
Content to be added:
<SELECT name="sel" id="sel" size="4" onChange="addContent('result', this[this.selectedIndex].text);">
</SELECT>
<input type="button" value="Details" onClick="itemDetails('result', document.getElementById('sel').selectedIndex)">
</form>
<br><br>
Your content will be added dynamically below:
<div id="result"></div>
<script type="text/javascript">
onload=allCall;
</script>
</body>
</html>
XML file: (details.xml)
<?xml version="1.0" encoding="utf-8"?>
<Root>
<Item>
<name>Item1</name>
<details>Item1 Details</details>
<content>Item1 Content</content>
</Item>
<Item>
<name>Item2</name>
<details>Item2 Details</details>
<content>Item2 Content</content>
</Item>
<Item>
<name>Item3</name>
<details>Item3 Details</details>
<content>Item3 Content</content>
</Item>
<Item>
<name>Item4</name>
<details>Item4 Details</details>
<content>Item4 Content</content>
</Item>
<Item>
<name>Item5</name>
<details>Item5 Details</details>
<content>Item5 Content</content>
</Item>
<Item>
<name>Item6</name>
<details>Item6 Details</details>
<content>Item6 Content</content>
</Item>
<Item>
<name>Item7</name>
<details>Item7 Details</details>
<content>Item7 Content</content>
</Item>
<Item>
<name>Item8</name>
<details>Item8 Details</details>
<content>Item8 Content</content>
</Item>
</Root>
- 2 TL;DR. Come up with the smallest possible code that exhibits the issue. – Ignacio Vazquez-Abrams Commented Jul 18, 2011 at 7:16
3 Answers
Reset to default 4You haven't said what exactly happens when you run your code sample with IE, which version of IE you tried, which error you get for which statement. One possible issue is simply a typo in your code, instead of xmlhttp = new ActiveXObject("Micrsoft.XMLHTTP") you need xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"). Whether that is the part of your code causing your problem is hard to tell, it depends on the IE version and its settings whether that code branch is used at all.
According to a blog post at
- http://www.nczonline/blog/2009/04/04/xpath-in-javascript-part-3/
Internet Explorer (at least up to IE8) doesnt implement the DOM Level 3 XPath Specs on document but provides it's own implementation via the MSXML2.DOMDocument ActiveX object on XML documents.
A pitfall in IE 9 is that it supports some methods that previously have been associated with other browsers. For example I have a code that was working in IE 8 and Firefox, but not in IE 9. The explanation was very simple: IE 9 was attempting to run down the Firefox branch, and failing of course: IE9 does not support document.evaluate method of Xpath.
// Code for Firefox
// Wrong!
if ( document.implementation && document.implementation.createDocument ) {
// stops IE8, but not IE9 from running the below code
// do some Xpath stuff ie. document.evaluate(//more code here )}
// Correct
if ( navigator.appName != "Microsoft Internet Explorer" ) {
// stops IE 8 and IE 9 from running the below code
// do some Xpath stuff ie. document.evaluate(//more code here ) }