<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Katalógus lapozás megvalósítása</title>
<meta name="author" content="Tóth Péter" />
<meta name="copyright" content="© 2012, NYME SEK" />
<meta http-equiv="date" content="2012-09-14" />
<meta name="revised" content="Tóth Péter, 14/09/2012" />
<meta name="description" content="XML - Katalógus lapozás megvalósítása" />
<meta http-equiv="content-language" content="hu" />
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<script type="text/javascript">
<!--
// Globális változóban kell tárolni a könyvek összes adatát ill. a formázott megjelenést
var aKonyvek=new Array();
// és az éppen megjelenített könyv index-ét
var idx=0;
// Könyvek lapozása jobbra/előre a listában
function funcLapozElore(){
if(idx<aKonyvek.length-1)
// aktuális index növelése
idx=idx+1;
else
// Ha a lista végére értünk, akkor az elsővel folytatjuk a megjelenítést
idx=0;
// Aktuális könyv adatainak megjelenítése
document.getElementById("idKonyv").innerHTML=aKonyvek[idx];
}
// Könyvek lapozása balra/hátra a listában
function funcLapozHatra(){
if(idx>0)
// aktuális index csökentése
idx=idx-1;
else
// Ellőnőrizzük, hogy a lista elejére értünk-e, mert akkor ugrás a lista végére
idx=aKonyvek.length-1;
// Aktuális könyv adatainak megjelenítése
document.getElementById("idKonyv").innerHTML=aKonyvek[idx];
}
// OnLoad
function funcStart(){
// XML fájl betöltése
if(window.XMLHttpRequest)
var xmlhttp=new XMLHttpRequest();
else
var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.open("GET","konyvek.xml",false);
xmlhttp.send();
// Könyvek adatinak kiolvasása
var xmlDoc=xmlhttp.responseXML.getElementsByTagName("konyv");
// Végigmegyünk az összes könyvön és előre elkészítjük a megjelenési formátumot
for(i in xmlDoc)if(xmlDoc[i].nodeType){
// Egy könyv formázott megjelenítének összeállítása
var txt="<table>";
for(j in xmlDoc[i].childNodes)if(xmlDoc[i].childNodes[j].nodeType)if(xmlDoc[i].childNodes[j].nodeType!=3)
txt+="<tr><td>"+xmlDoc[i].childNodes[j].nodeName+"</td><td>"+xmlDoc[i].childNodes[j].childNodes[0].nodeValue+"</td></tr>";
txt+="</table>";
// A tárolóban már a megjelenést tároljuk le, így amikor lapozunk csak egyszerűáen meg kell jeleníteni, nem kell a formázással foglalkozni
aKonyvek.push(txt);
}
// Első könyv adatainak megjelenítése
document.getElementById("idKonyv").innerHTML=aKonyvek[idx];
}
-->
</script>
</head>
<body onload="funcStart()">
<div>
<div id="idKonyv"></div>
<br/>
<input type="button" value="hátra" onclick="javascript:funcLapozHatra()" />
<input type="button" value="előre" onclick="javascript:funcLapozElore()" />
</div>
</body>
</html>