nicht angemeldet
AJAX
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
-
hi,
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?
Im Verständnis von document.write.
Nach dem fertig laden aufgerufen, _ersetzt_ dieses das komplette Dokument.Nutze innerHTML, oder erstelle neue Elemente und hänge sie ein, über DOM-Methoden createElement, appendChild/insertBefore etc.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
hi,
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?
Im Verständnis von document.write.
Nach dem fertig laden aufgerufen, _ersetzt_ dieses das komplette Dokument.Nutze innerHTML, oder erstelle neue Elemente und hänge sie ein, über DOM-Methoden createElement, appendChild/insertBefore etc.
ich darf das mal ergänzen:
--roro
-
Hallo Rolf,
schön das ich ausgerechnet dich im Forum treffe ;-)
Ich habe leider mit JavaScript sehr wenig Erfahrung. Gibt es irgendwo ein Beispiel wo ich mir das entsprechende Wissen herauslesen kann? Das du mir hier mal eben kurz den Quelltext für die Stelle schreibst ist sicher zuviel verlangt, aber wie du siehst kann ich mir aus entsprechenden Beispielen durchaus das nötige Wissen ableiten und erlernen.
Gruß Rainer
-
moin Rainer,
schön das ich ausgerechnet dich im Forum treffe ;-)
jo, bin in letzter Zeit mal wieder öfer hier, weil ich mit Javascript auch noch nicht so fit bin ;-)
Ich habe leider mit JavaScript sehr wenig Erfahrung. Gibt es irgendwo ein Beispiel wo ich mir das entsprechende Wissen herauslesen kann? Das du mir hier mal eben kurz den Quelltext für die Stelle schreibst ist sicher zuviel verlangt, aber wie du siehst kann ich mir aus entsprechenden Beispielen durchaus das nötige Wissen ableiten und erlernen.
Tja, Erfahrungen musst Du selber machen. Mein Ajax-Artikel ist auch nur der Einstieg, nicht mehr. Hab dafür jedoch schon sehr gute Kritiken bekommen, unter Anderem vom Perlmeister.com
Viele Grüße, Rolf
-
-
-