Rainer: AJAX

Beitrag lesen

Hallo Forumsfreunde,

ich habe mal angefangen mich mit AJAX zu befassen und mir das Beispiel:

http://rolfrost.de/cgi-bin/xmlhttpreq.cgi geladen und gelesen.
Jetzt wollte ich es mal auf PHP/MYSQL ändern und auf <SELECT> umstellen. Als Beispiel habe

ich Type / Modell für Auto genommen.

Die Datenbank:

ID Type  ID TypeID Modell
1  VW  1  1      Polo
2  Ford  2  1      Passat
  3  2      CMax
  4  2      Focus

#index.php#
<?php include("connect.inc.php"); ?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Ajaxtest</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<script type=text/javascript>
var req;
function loadXMLDoc(url)
{
// branch for native XMLHttpRequest object
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
req.onreadystatechange = processReqChange;
req.open("GET", url, true);
req.send(null);
// branch for IE/Windows ActiveX version
} else if (window.ActiveXObject) {
req = new

ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange =
processReqChange;
req.open("GET", url, true);
req.send();
}
}
}
</script>
<P>Type: <select name="type" id="type"

onChange="loadXMLDoc('xmlhttpreq.php?type='+document.getElementById('type').value);">
 <option value="">[ Bitte auswählen ]</option>
<?php
 $sql = mysql_query("SELECT ID,Type FROM type ORDER BY ID");
  while($dat = mysql_fetch_row($sql)):
   echo"<option value="$dat[0]">$dat[1]</option>";
    endwhile;
?>
</select><BR>
 <BR>
 Modell:
 <select id="modell">
 <option value="">[ Bitte auswählen ]</option>
 <script type=text/javascript>
 function processReqChange()
{
// only if req shows "complete"
if (req.readyState == 4) {
// only if "OK"
if (req.status == 200) {
// ...processing statements go here...

document.write ("req.responseText");

} else {
alert("There was a problem retrieving the XML data");
}
}
}
 </script>
 </select>
 <br>
<hr>
 <P>   <script type=text/javascript>
 function processReqChange()
{
// only if req shows "complete"
if (req.readyState == 4) {
// only if "OK"
if (req.status == 200) {
// ...processing statements go here...

document.getElementById('res').value = req.responseText;

} else {
alert("There was a problem retrieving the XML data");
}
}
}
   </script>
 Anzeige OK:
 <input id=res size="80">
 </body>
</html>

#xmlhttpreq.php#
<?php
 include("connect.inc.php");
 $erg = "";
 $sqlx = mysql_query("SELECT ID,Modell FROM modell WHERE TypeID = '".$_GET["type"]."' ORDER BY modell");
  while($datx = mysql_fetch_row($sqlx)):
  $erg .= "<option value=$datx[0]>$datx[1]</option>";
  endwhile;
  print $erg;
  exit;
?>

Beim testen wird im <input id="res" size="80"> der req.responseText korrekt angezeigt. Im oberen Teil innerhalb <select id=modell> will ich diesen mit document.write einsetzen. Das funktioniert NICHT. Wo ist mein Fehler?
Alles zu sehen unter: http://ajaxtest-de.km21935-25.keymachine.de

Gruß Rainer