Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Basic XML embed into HTML with 'XML DOM Parser'

Status
Not open for further replies.
Well, using the examples from that tutorial:
Code:
<script type="text/javascript">
 var xmlhttp;
 var strURL = "[URL unfurl="true"]http://fleenland.myminicity.com/xml";[/URL]
 function loadXMLDoc(url){
  xmlhttp=null;
  // code for Mozilla, etc.
  if (window.XMLHttpRequest){
   xmlhttp=new XMLHttpRequest();
  }
  // code for IE
  else if (window.ActiveXObject){
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  if(xmlhttp!=null){
   xmlhttp.onreadystatechange=state_Change;
   xmlhttp.open("GET",url,true);
   xmlhttp.send(null);
  }
  else{
   alert("Your browser does not support XMLHTTP.");
  }
 }
			
 function state_Change(){
  // if xmlhttp shows "loaded"
  if (xmlhttp.readyState==4){
   // if "OK"
   if (xmlhttp.status==200){
    // ...some code here...
    populateDivTag();
   }
   else{
    alert("Problem retrieving XML data");
   }
  }
 }
			
 function populateDivTag(){
  var response = xmlhttp.responseXML.documentElement;
  var popNodes = response.getElementsByTagName("population");
  var target = document.getElementById("mytargetdiv");
  if(popNodes.length > 0){
   var popNode = popNodes[0];
   var popNodeVal = popNode.childNodes[0].nodeValue;
   target.innerHTML = "<label>Population:</label> " + popNodeVal;
  }
 }
</script>

Which assumes you have a div tag somewhere with the ID of "mytargetdiv" - change that to whatever, wherever you want the text placed.

Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.

Webflo
 
Ok, so I've added "<div id="mytargetdiv"></div>" into the body of the same HTML file along with the script you posted, but still nothing happens..

=S
 
drahcir144 said:
Ok, so I've added "<div id="mytargetdiv"></div>" into the body of the same HTML file along with the script you posted, but still nothing happens..

You may need to view it through a web browser.

Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.

Webflo
 
I tested using FF2, IE6 and IE7 and all worked fine.

"Doesn't work" is not exactly helpful. What doesn't work? Where does your script stop working? What error is being returned?

Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.

Webflo
 
I don't get an error, but when I open the .htm file in IE or Firefox it just displays a white page with nothing on it.

This is the whole .htm file;

Code:
<html>
<head>

<script type="text/javascript">
 var xmlhttp;
 var strURL = "[URL unfurl="true"]http://fleenland.myminicity.com/xml";[/URL]
 function loadXMLDoc(url){
  xmlhttp=null;
  // code for Mozilla, etc.
  if (window.XMLHttpRequest){
   xmlhttp=new XMLHttpRequest();
  }
  // code for IE
  else if (window.ActiveXObject){
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  if(xmlhttp!=null){
   xmlhttp.onreadystatechange=state_Change;
   xmlhttp.open("GET",url,true);
   xmlhttp.send(null);
  }
  else{
   alert("Your browser does not support XMLHTTP.");
  }
 }
            
 function state_Change(){
  // if xmlhttp shows "loaded"
  if (xmlhttp.readyState==4){
   // if "OK"
   if (xmlhttp.status==200){
    // ...some code here...
    populateDivTag();
   }
   else{
    alert("Problem retrieving XML data");
   }
  }
 }
            
 function populateDivTag(){
  var response = xmlhttp.responseXML.documentElement;
  var popNodes = response.getElementsByTagName("population");
  var target = document.getElementById("mytargetdiv");
  if(popNodes.length > 0){
   var popNode = popNodes[0];
   var popNodeVal = popNode.childNodes[0].nodeValue;
   target.innerHTML = "<label>Population:</label> " + popNodeVal;
  }
 }
</script>

</head>

<body>

<div ID="mytargetdiv"></div>

</body>

</html>
 
You have no idea how a script function start running, do you?! If it is not called, it won't run as a matter of course. One way is this.
[tt] <body [red]onload="loadXMLDoc(strURL)"[/red]>[/tt]
 
I did mention in the first post that I am new to this =D

It now looks like this but when I open it I still see a blank page.

Code:
<html>
<head>

<script type="text/javascript">
 var xmlhttp;
 var strURL = "[URL unfurl="true"]http://fleenland.myminicity.com/xml";[/URL]
 function loadXMLDoc(url){
  xmlhttp=null;
  // code for Mozilla, etc.
  if (window.XMLHttpRequest){
   xmlhttp=new XMLHttpRequest();
  }
  // code for IE
  else if (window.ActiveXObject){
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  if(xmlhttp!=null){
   xmlhttp.onreadystatechange=state_Change;
   xmlhttp.open("GET",url,true);
   xmlhttp.send(null);
  }
  else{
   alert("Your browser does not support XMLHTTP.");
  }
 }
            
 function state_Change(){
  // if xmlhttp shows "loaded"
  if (xmlhttp.readyState==4){
   // if "OK"
   if (xmlhttp.status==200){
    // ...some code here...
    populateDivTag();
   }
   else{
    alert("Problem retrieving XML data");
   }
  }
 }
            
 function populateDivTag(){
  var response = xmlhttp.responseXML.documentElement;
  var popNodes = response.getElementsByTagName("population");
  var target = document.getElementById("mytargetdiv");
  if(popNodes.length > 0){
   var popNode = popNodes[0];
   var popNodeVal = popNode.childNodes[0].nodeValue;
   target.innerHTML = "<label>Population:</label> " + popNodeVal;
  }
 }
</script>

</head>

[red]<body onload="loadXMLDoc(strURL)">[/red]


<div ID="mytargetdiv"></div>

</body>

</html>
 
>Basically I'm new to XML
You didn't say you are basically new to html as well? Even you declare so, it is not a licence to get help on topic not so elementary.

It is a permission problem of the browser. Rather than changing the security setting wholesale, you can do it on case-by-case basis and via script. Like this for these two functions.

[1]
[tt]function loadXMLDoc(url){
xmlhttp=null;
// code for Mozilla, etc.
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}
// code for IE
else if (window.ActiveXObject){
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

[blue]if (window.XMLHttpRequest) {
try {
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
} catch (e) {
alert("Permission UniversalBrowserRead denied.");
}
}[/blue]

if(xmlhttp!=null){
xmlhttp.onreadystatechange=state_Change;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}
else{
alert("Your browser does not support XMLHTTP.");
}
}
[/tt]
[2]
[tt]function populateDivTag(){

[blue]if (window.XMLHttpRequest) {
try {
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
} catch (e) {
alert("Permission UniversalBrowserRead denied.");
}
}[/blue]

var response = xmlhttp.responseXML.documentElement;
var popNodes = response.getElementsByTagName("population");
var target = document.getElementById("mytargetdiv");
if(popNodes.length > 0){
var popNode = popNodes[0];
var popNodeVal = popNode.childNodes[0].nodeValue;
target.innerHTML = "<label>Population:</label> " + popNodeVal;
}
}
[/tt]
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top