I have this xml file with 10 quotes. What I would like to do is on clicking a submit btn, only 1 quote will display, on the 2nd click it will display a new quote and so on.
All this inside a small box. To call this I'm using Javascript
So far I got everything working except I hit a brick wall and can't figure out how to display 1 line per click. Any advice/help? I would tremendously appreciate it!
XML(sample_quotes.xml)
<?xml version="1.0" encoding="utf-8"?> <quotes> <heading>Quotes about Life</heading> <quote> <person>Buddha</person> <text>If we could see the miracle of a single flower clearly, our whole life would change.</text> </quote> <quote> <person>Carl Jung</person> <text>There are as many nights as days, and the one is just as long as the other in the year's course. Even a happy life cannot be without a measure of darkness, and the word 'happy' would lose its meaning if it were not balanced by sadness.</text> </quote> <quote> <person>Helen Keller</person> <text>Security is mostly a superstition. It does not exist in nature, nor do the children of men as a whole experience it. Avoiding danger is no safer in the long run than outright exposure. Life is either a daring adventure or nothing.</text> </quote> <quote> <person>Henry James</person> <text>Be not afraid of life. Believe that life is worth living, and your belief will help create the fact.</text> </quote> <quote> <person>Martin Luther King Jr.</person> <text>An individual has not started living until he can rise above the narrow confines of his individualistic concerns to the broader concerns of all humanity.</text> </quote> <quote> <person>Mark Twain</person> <text>Let us so live that when we come to die even the undertaker will be sorry.</text> </quote> <quote> <person>Oscar Wilde</person> <text>To live is the rarest thing in the world. Most people exist, that is all.</text> </quote> </quotes>
HTML:
<body> <div id="wrapper"> <div class="header"> <h1>Ajax Quotes</h1> </div><!-- END OF HEADER--> <div class="quotebox"> <div id="MyID"> </div> </div><!-- END OF QUOTING BOX--> <form name="myform" id="myform" method="post"action="" > <div class="quotes"> <input type="submit" name="btnNext" id="btnNext" value="Next Quote" onclick="return store(this)"/> </div> <!-- quotes--> </form><!-- end of form--> </div><!--END OF WRAPPER--> </body>
Javascript(request.js):
var request;
try{
request = new XMLHttpRequest();
}catch(e){
try{
request = new ActiveXObject("MSXml.XMLHTTP");
}catch(e1){
try{
request = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e2){
request = null;
}
}
}
Javascript(global.js):
window.onload = function(){
request.open('POST', 'sample_quotes.xml',true);
request.onreadystatechange = function(){
//4 being all loaded
if(request.readyState == 4){
//A file has loaded
switch(request.status){
case 200:
//ok
//alert('OK.');
//---------//////////////// DISPLAY QUOTES \\\\\\\\\\\\\\\\\\--------------
var text = request.responseXML.getElementsByTagName("text")
for(i=0;i<text.length;i++){
var p = document.createElement("p");
var t = document.createTextNode(text[i].childNodes[0].nodeValue);
p.appendChild(t);
document.getElementById('MyID').appendChild(p);
}
//---------//////////////// DISPLAY QUOTES ENDS \\\\\\\\\\\\\\\\\\--------------
break;
case 404:
//File not found
alert('Sorry. My dog ate the file.');
break;
case 403:
//Permission Denied
alert("Sorry. My mom won't let me give you the file");
break;
case 500:
//Server Side error
alert("Sorry. PHP feel asleep while building your file.");
break;
default:
alert("I don't know what happened. But it wasn't good. lol");
}
}
}
request.send(null);
}
Any small contribution will help me a lot. I tried googling (best dictionary), tried searching in my book (unfortunately it won't tell you where you're wrong) and now I'm stranded.
If I miss any info please let me know.
****EDIT**** Sorry for misspelling - it's late and grumpy.
Also, I know you can make each quote unique by giving them "[1]" "[2]" and so on... but how would Javascript know who's 1 or 2?
This post has been edited by skillionaire: 29 September 2008 - 04:47 PM

New Topic/Question
Reply



MultiQuote




|