...

View Full Version : Load XML file onclick



katpal
06-28-2012, 10:40 AM
Hi to all,
I am trying to load a different xml file everytime a link is clicked, based on its href.
I have the following in head:

JAVASCRIPT


window.onload=function() {
loadXMLDoc("papers.xml"); // loads the default xml file so that page is not empty
}

function scanForXML(){
var extLinks=document.getElementById('results_list').getElementsByTagName('a');
for (i=0; i<extLinks.length; i++) {
extLinks[i].onclick=function getName()
{
var fileName=this.getAttribute('href');
loadXMLDoc(fileName);
return false;
}
}
}

HTML


<ol id="results_list">
<li> <a class="tooltip" href="paper2.xml"> Teaching with Tablet PC's </a></li>
<li> <a href="paper3.xml" class="tooltip"> Tablet PC’s as Instructional Tools </a></li>
</ol>

The onclick event works, I get the href value but the new xmlFile does not get loaded.:confused:
Any ideas why?

ps: no jquery plz, cannot use that. trying to learn better basic javascript


sorry here is the load code - by the way it does not work in chrome and opera - but works (the default xml file gets loaded) in safari andFF


function loadXMLDoc(dname)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET",dname,false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
}



Thanks!
K.

Old Pedant
06-28-2012, 09:43 PM
How can we guess what is in your loadXMLDoc( ) function?

Show that.

katpal
06-29-2012, 10:34 AM
Sorry you are right. File loadXmlData.js has (among others) the following:


function loadXMLDoc(dname)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET",dname,false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
}

ps: by the way this only works in FF (chrom, safari and opera do not parse the xml file) :mad:

katpal
06-30-2012, 12:02 PM
help?
:(

Old Pedant
07-01-2012, 05:58 AM
Your loadXMLDoc function gets the file and parses it (and all browsers WILL do so, some with quirks), but then it just throws the result away. Or, rather, it just stores the result in the (assumed) global variable. You have shown NO CODE WHATSOEVER that then DOES anything with the XML. MAYBE you have code that uses it, but how can we guess what it is when you don't show it?

katpal
07-01-2012, 07:34 AM
I am sorry again, did not want to throw at you all lines of beginner's code I've been working with...
here it is:

Javascript (external file)


function loadXMLDoc(url)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET",url,false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
}
//}

function get_set_Data () {
var preferedSize=300;

var title=xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;
var author=xmlDoc.getElementsByTagName("author")[0].childNodes[0].nodeValue;
var abstract_preview=xmlDoc.getElementsByTagName("abstract_preview")[0].childNodes[1].nodeValue;

var newAbsReview=abstract_preview.substring(0, preferedSize) + " <font color='green'> ... more info";

document.getElementById("header").getElementsByTagName('h1')[0].innerHTML= title;
document.getElementById("header").getElementsByTagName('h6')[0].innerHTML= author;
document.getElementById("abstract").getElementsByTagName('div')[0].innerHTML= newAbsReview;


so title, author, abstract review (and other nodes but no reason to display here) are retrieved and then displayed in specific elements in the HTML document. These nodes exist in all xml files, see examples below.

This works the first time around with the default xml file (see: loadXMLDoc("paper2.xml") in the window.onload function below.

The problem occurs when I try to load a new xml file onclick.

By the way my HTML code has evolved to the below now (not sure if its for better or worse...):

HTML document:


<script type="text/javascript">

window.onload=function() {
loadXMLDoc("paper2.xml");
get_set_Data();
scan(); //displays the full info of preview -- irrelevant for this exercise
scanForXML();
highlite(); // -- irrelevant for this exercise
}

var filename;
var xml;
function LoadName(filename){
var xml = loadXMLDoc(filename);
alert ("the file " + filename + " has been loaded ");
alert(xml.getElementsByTagName("title")[0].childNodes[0].nodeValue); //for testing
return false;
}

function scanForXML(){
var extLinks=document.getElementById('results_list').getElementsByTagName('li');<br />
for (i=0; i<extLinks.length; i++) {
extLinks[i].onclick=function()
{
LoadName(this.id);
return false;
alert(this.id);

}
}
}

</script>

I have changed the HTML code to retrieve the li ID value rather than using the href attribute. It gets the right variable but then the



<ol id="results_list">
<li id="paper2.xml">
<a class="tooltip" href="#">highlite Teaching with Tablet PC's </a>
</li>
<li id="paper3.xml"> <a href="#" class="tooltip">Tablet PC’s as Instructional Tools
or the Pen is Mightier than the ’Board!</a>
</li>
<li id="paper4.xml"> <a href="#" class="tooltip">Improving Learning in CS1 via Tablet-PC-based</a></li>
</ol>


XML code

XML file 1


<?xml version="1.0" encoding="ISO-8859-1"?>
<CATALOG>
<paper>
<title>TEACHING WITH TABLET PC'S</title>
<author>Kenrick Mock [ 2004 ]</author>
<abstract_preview>
<![CDATA[ <h2>ABSTRACT</h2>
highlight Tablet PC's are traditional notebook computers with the ability to process
digital ink by writing with a stylus. They have recently attracted attention as
a potential tool for educational use. ]]>
</abstract_preview>
</paper>
</CATALOG>


XML file 2


<?xml version="1.0" encoding="ISO-8859-1"?>
<CATALOG>
<paper>
<title>Learning in CS1 via Tablet-PC-based In-Class Assessment</title>
<author>Kimberle Koile</author>
<abstract_preview>
<![CDATA[
<h2>ABSTRACT</h2>
This paper describes two pilot studies, one completed and one ongoing, that evaluate the use of Tablet PCs and a Tablet-PC- based classroom presentation system in an introductory computer science class. The presentation system, Classroom Presenter [2,3], supports student wireless submission of digital ink answers to in-class exercises. ]]>
</abstract_preview>
</paper>
</CATALOG>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum