Hallo
Ich arbeite mich gerade durch das Buch HTML5 und CSS3 von Jürgen Wolf. Jetzt bin ich im Kapitel AJAX und komme nicht weiter.
Es wurde ein Umrechner von Einheiten erstellt. In diesem Fall von Meter auf Yard und Meilen.
Hier der html Code
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Umrechnen von Einheiten</title>
<script>
var xmlhttp = null;
function recalculate(str) {
if(window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlhttp = new ActiveXObject("Micosoft.XMLHTTP");
}
xmlhttp.open("Get", "calculate.php?meter="+str, true);
xmlhttp.onreadystatechange = parseRecalculate;
xmlhttp.send();
}
function parseRecalculate(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
var xml = xmlhttp.responseXML;
var meilen_response = xml.getElementsByTagName("meilen")[0];
var yard_responce = xml.getElementsByTagName("yard")[0];
document.getElementById("meilen").value = meilen_response.firstChild.nodeValue;
document.getElementById("yard").value = yard_responce.firstChild.nodeValue;
}
else {
document.getElementById("meilen").value = 0;
document.getElementById("yard").value = 0;
}
}
</script>
</head>
<body>
<h1>Umrechnen von Einheiten</h1>
<form>
<fieldset>
<legend>Meter in Meilen und Yard umrechnen</legend>
<br><label>Meter</label>
<input type="number" id="meter" placeholder="Wert in Meter" onkeyup="recalculate(this.value);"> m
<br><label>Meilen</label>
<input type="number" id="meilen" placeholder="Umrechnen in Meilen" readonly="yes">mi
<br><label>Yard</label>
<input type="number" id="yard" placeholder="Umrechnen in Yard" readonly="yes"> yds
</fieldset>
</form>
</body>
</html>
Alles anzeigen
Hier der dazu gehörige php code
<?php
header("Conten-Type: text/xml");
$meter = $_REQUEST['meter'];
$meilen = $meter * 0.006213711922373339;
$yard = $meter * 1.0936133;
echo "<?xml version=\"1.0\" encoding=\"utf-8\"?>";
?>
<umwandlung>
<meter><?php echo $meter; ?></meter>
<meilen><?php echo $meilen; ?></meilen>
<yard><?php echo $yard; ?></yard>
</umwandlung>
Alles anzeigen
Die html Seite wird auch angezeigt aber wenn ich jetzt den Wert für Meter eingebe wird mir ein Fehler entgegen geworfen für Zeile 22
Ich habe natürlich auch nach dem Fehler gegoogelt. Der Fehler bedeutet das Objekt null / leer ist. Was ich aber nicht verstehe. In der Entwickler Ansicht, im Safari Browser (Version 12.0 (13606.2.11)), sehe ich im Bereich Ressourcen das der php Code richtig ausgeführt wurde.
Vielleicht können ihr mich in die richtige Richtung stupsen. Ich versuche das schon den ganzen Tag zu Verstehen und in den Griff zu bekommen.
Hier noch mal die Hardware und Software auf der ich das Probiere
Client:
MacBook Air (11 Zoll, Mitte 2011)
Browser Safari (Version 12.0 (13606.2.11) & Firefox Quantum 62.0.3
Server:
Raspberry Pi ZeroW
pi@airmonitor:~ $ cat /etc/os-release
PRETTY_NAME="Raspbian GNU/Linux 9 (stretch)"
NAME="Raspbian GNU/Linux"
VERSION_ID="9"
VERSION="9 (stretch)"
ID=raspbian
ID_LIKE=debian
HOME_URL="http://www.raspbian.org/"
SUPPORT_URL="http://www.raspbian.org/RaspbianForums"
BUG_REPORT_URL="http://www.raspbian.org/RaspbianBugs"
pi@airmonitor:~ $ apache2 -version
Server version: Apache/2.4.25 (Raspbian)
Server built: 2018-06-02T08:01:13
Alles anzeigen
Ich hoffe ihr könnt mir weiterhelfen.
Danke
Oliver