nicht angemeldet
AJAX: Problem mit zwei xml-Dateien
JürgenBHi!
Habe ein paar Probleme mit AJAX!
Ich möchte gern zwei xml-Dateien nacheinander abarbeiten, nach bestimmten Informationen suchen und ausgeben lassen.
Also mein Quelltext sieht zu Zeit so aus:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title>Der Vertretungsplan-Finder</title>
<link rel="stylesheet" type="text/css" href="vplan.css"/>
<script type="text/javascript" language="javascript">
var ausgabe;
function anzeigen () {
ausgabe = '';
makeRequest('080604.xml');
makeRequest('080605.xml');
document.getElementById('ausgabe').innerHTML = ausgabe;
}
var http_request = false;
function makeRequest(url) {
http_request = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
http_request.overrideMimeType('text/xml');
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!http_request) {
alert('Es tut uns leid, aber dein Browser wird nicht unterstützt!');
return false;
}
http_request.onreadystatechange = alertContents;
http_request.open('GET', url, true);
http_request.send(null);
}
function alertContents() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
//Ab hier Abfragenprogrammierung
var xml = http_request.responseXML;
var klasse = document.Klasse.Klasse.options[document.Klasse.Klasse.selectedIndex].value;
var tempausgabe = '';
var datenvorhanden = false;
tempausgabe = tempausgabe + '<p>'+
'<span class="vpfuer">Vertretungsplan für <span class="vpfuerdatum">' + xml.getElementsByTagName('titel')[0].firstChild.nodeValue + '</span></span><br>'+
'aktualisiert am '+ xml.getElementsByTagName('datum')[0].firstChild.nodeValue +
'</p>'+
'<table border=1>'+
'<tr>'+
'<th class="thplanklasse">Klasse/Kurs</th>'+
'<th class="thplanstunde">Stunde</th>'+
'<th class="thplanfach">Fach</th>'+
'<th class="thplanlehrer">Lehrer</th>'+
'<th class="thplanraum">Raum</th>'+
'<th class="thplaninfo">Info</th>'+
'</tr>';
for (var i = 0; i <= xml.getElementsByTagName('klasse').length; i++) {
var test = xml.getElementsByTagName('klasse')[i].firstChild.nodeValue;
if (test == klasse) {
tempausgabe = tempausgabe +
'<tr>'+
'<td class="thplanklasse">'+ xml.getElementsByTagName('klasse')[i].firstChild.nodeValue +'</td>'+
'<td class="thplanstunde">'+ xml.getElementsByTagName('stunde')[i].firstChild.nodeValue + '</td>'+
'<td class="thplanfach">'+ xml.getElementsByTagName('fach')[i].firstChild.nodeValue + '</td>'+
'<td class="thplanlehrer">'+ xml.getElementsByTagName('lehrer')[i].firstChild.nodeValue + '</td>'+
'<td class="thplanraum">'+ xml.getElementsByTagName('raum')[i].firstChild.nodeValue + '</td>'+
'<td class="thplaninfo">'+ xml.getElementsByTagName('info')[i].firstChild.nodeValue + '</td>'+
'</tr>';
datenvorhanden=true;
}
}
tempausgabe = tempausgabe + '</table>';
if (datenvorhanden) {
ausgabe = ausgabe + tempausgabe;
} else {
ausgabe = ausgabe + '<span class="vpfuer">Vertretungsplan für <span class="vpfuerdatum">' + xml.getElementsByTagName('titel')[0].firstChild.nodeValue + '</span></span><br>'+
'aktualisiert am '+ xml.getElementsByTagName('datum')[0].firstChild.nodeValue +'<br><br> An diesem Tag hast du keine Vertretung!'; }
} else {
alert('Es gab ein serverseitiges Problem!');
}
}
}
</script>
</head>
<body bgcolor="#ffffff">
<div align="center">
<p>Wähle deine Klasse und deine Vertretung wird angezeigt!</p>
<form name="Klasse">
<select name="Klasse" size="1" onchange="anzeigen()">
<option value="05.1">Klasse 5/1</option>
<option value="05.2">Klasse 5/2</option>
<option value="05.3">Klasse 5/3</option>
<option value="05.4">Klasse 5/4</option>
<option value="05.5">Klasse 5/5</option>
<option value="06.1">Klasse 6/1</option>
<option value="06.2">Klasse 6/2</option>
<option value="06.3">Klasse 6/3</option>
<option value="06.4">Klasse 6/4</option>
<option value="07.1">Klasse 7/1</option>
<option value="07.2">Klasse 7/2</option>
<option value="07.3">Klasse 7/3</option>
<option value="08.1">Klasse 8/1</option>
<option value="08.2">Klasse 8/2</option>
<option value="08.3">Klasse 8/3</option>
<option value="08.4">Klasse 8/4</option>
<option value="09.1">Klasse 9/1</option>
<option value="09.2">Klasse 9/2</option>
<option value="09.3">Klasse 9/3</option>
<option value="09.4">Klasse 9/4</option>
<option value="10.1">Klasse 10/1</option>
<option value="10.2">Klasse 10/2</option>
<option value="10.3">Klasse 10/3</option>
<option value="10.4">Klasse 10/4</option>
</select>
</form>
</div>
<br>
<div id="ausgabe"></div>
</body>
</html>
Aber es gibt neuerdings zwei Fehler: Fehler eins ist, dass immer beim Firebug angezeigt wird:
xml.getElementsByTagName("klasse")[i] has no properties
var test = xml.getElementsByTagName('klasse')[i].firstChild.nodeValue;
Und der zweite Fehler ist, dass gar keine Ausgabe stattfindet! :-(
Wie kann ich das beheben?
Habt ihr vielleicht nocht TIPPS oder Hinweise?
Euer lufox
-
for (var i = 0; i <= xml.getElementsByTagName('klasse').length;
Also gut, ersten Fehler gefunden: das muss
xml.getElementsByTagName('klasse').length-1
heißen! Aber die Anzeige funktioniert immer noch nicht... liegt das irgendwie an der Variablen???
Bitte helft mir!
Gruß lufox
-
for (var i = 0; i <= xml.getElementsByTagName('klasse').length;
Also gut, ersten Fehler gefunden: das muss
xml.getElementsByTagName('klasse').length-1
heißen! Aber die Anzeige funktioniert immer noch nicht... liegt das irgendwie an der Variablen???
Bitte helft mir!
Gruß lufox
und was zeigt er nun fürn Fehler an ?
Führt er die Schleife überhaupt aus?
-
Sorry für Doppelpost... aber könntest Du eine kurze Beispiel-XML Datei posten?
Der Zugriff hier: xml.getElementsByTagName('stunde')[i].firstChild.nodeValue
bedeutet, dass du eine eigene Liste von <Stunde> hast, und diese nicht Teil von <Klasse> ist.
-
Als ich jetzt das ganze synchron abgelaufen lassen habe, funktioniert es nur im IE im Firefox dagegen wird die Ausgabe nicht gemacht... Was kann ich dagegen tun?
Ich habe irgendwo schon was gesehen von wegen Finished-Flag aber das kapiere ich nicht... wo muss das eingefügt werden?
if (this.asynchronous == false) {
self.Finished();
}Gruß Flo
PS: Die Beispielseite liegt hier: http://vp.cottagym.de/vertretungneu.html
-
Hi,
Als ich jetzt das ganze synchron abgelaufen lassen habe, funktioniert es nur im IE im Firefox dagegen wird die Ausgabe nicht gemacht... Was kann ich dagegen tun?
Das sieht nicht nach synchron aus:
http_request.open('GET', url, true);Hier kannst du nachlesen, wie du die Methode open() aufrufen musst, damit der Request synchron ausgeführt wird.
Ich habe irgendwo schon was gesehen von wegen Finished-Flag aber das kapiere ich nicht...
Ich kenne das auch nicht.
Ich kenne aber den Eventhandler oneadystatechanged mit dessen Hilfe du informiert wirst, wenn der Request seinen Status (ein Status ist, dass der Request fertig ist) ändert.mfG,
steckl
-
-
-
-
-
Falls Du freie Hand hast würde ich Dir empfehlen mal JSON anzuschauen. Es ist eine Alternative zu XML und einfacher zu handhaben.
Ansonsten nehme ich an, dass Deine For-Schleife falsch ist:
for (var i = 0; i <= xml.getElementsByTagName('klasse').length; i++)
{
...i sollt enur bis < xml.getElementsByTagName('klasse').length gehen!
-
Falls Du freie Hand hast würde ich Dir empfehlen mal JSON anzuschauen.
Brauche ich für JASON nicht PHP??? Ich habe doch xml-Dateien vorliegen, die ich auswerten will, dann müsste ich doch jede xml-Datei erst in das JSON- Format umwandeln, oder?
-
Falls Du freie Hand hast würde ich Dir empfehlen mal JSON anzuschauen.
Brauche ich für JASON nicht PHP??? Ich habe doch xml-Dateien vorliegen, die ich auswerten will, dann müsste ich doch jede xml-Datei erst in das JSON- Format umwandeln, oder?
Also PHP ist dafür nicht nötig mit var object = eval('+jsonString+') hast du dein komplettes Objekt.
Ja die XML-Datei müsste sozusagen als JSON Datei vorliegen, da dies nicht der Fall ist, würde ich bei XML bleiben.
-
-
-
Hallo lufox,
das "A" in "AJAX" steht für Asynchron. D.h. die Variable "ausgabe" ist, wenn du sie innerHTML zuweist, noch leer. Da du zwei Abfragen nacheinander durchführen möchtest, solltest du die Requests synchron laufen lassen.
Gruß, Jürgen
-
Hi!
Wie kann ich das machen? Wie soll ich sie synchron laufen lassen?Gruß flo
-
Hallo lufox,
Wie kann ich das machen?
schau dir mal diese Testseite an: http://www.j-berkemeier.de/test/Nachladen.html. Da geht es zwar um das Nachladen von Javascripten, aber hier habe ich den http-Request synchron aufgesetzt.
Gruß, Jürgen
-
-
-
Hi!
Als ich jetzt das ganze synchron abgelaufen lassen habe, funktioniert es nur im IE im Firefox dagegen wird die Ausgabe nicht gemacht... Was kann ich dagegen tun?Ich habe irgendwo schon was gesehen von wegen Finished-Flag aber das kapiere ich nicht... wo muss das eingefügt werden?
if (this.asynchronous == false) { self.Finished(); }Gruß Flo
PS: Die Beispielseite liegt hier: http://vp.cottagym.de/vertretungneu.html