<html>
<head>
<!-- Datei abfrage.html -->
<script language="JavaScript" src="utility_funktionen.js"></script>
<script language="JavaScript">
// Globales Ajax-Objekt erzeugen
ako = new ErzeugeAJAXObjekt();
//Globales Ajax-Kommunikationsobjekt erzeugen
ahro = ako.erzXMLHttpRequestObject();
// auf ENTER-Taste pruefen ...
function eintippen(e)
{
if (e.keyCode == 13) // RETURN-Taste
{
send_to_server();
}
}
// asynchrone Anfrage zum Webserver senden
function send_to_server()
{
zuname=document.getElementById("zuname").value;
vorname=document.getElementById("vorname").value;
zuname=my_encode(zuname);
vorname=my_encode(vorname);
http_parameter="zuname="+zuname+"&vorname="+vorname;
ahro.open("POST", "abfrage.php", true);
ahro.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
ahro.onreadystatechange=receive_from_server;
ahro.send(http_parameter);
document.getElementById('zuname').disabled=true;
document.getElementById('vorname').disabled=true;
document.getElementById('knopf').disabled=true;
document.getElementById('ort_der_antwort').innerHTML = "Bitte warten ..."
}
// asynchrone Anwort von Webserver
function receive_from_server()
{
if (ahro.readyState == 4)
{
document.getElementById('ort_der_antwort').innerHTML = ahro.responseText;
document.getElementById('zuname').disabled=false;
document.getElementById('vorname').disabled=false;
document.getElementById('knopf').disabled=false;
}
}
</script>
</head>
<body>
<div style="position:absolute; top:20px; left:10px; width:800; height:100px; background-color:red;">
<div align="center">
<table border="0" cellpadding="5" bgcolor="green">
<form>
<tr><td align="center"><b>TELEFONBUCH::EINTRAG SUCHEN</b><br></div><hr></td></tr>
<tr><td align='center'>
<b>Zuname<b> <input type='text' id='zuname' value='' onKeyPress="eintippen(event)">
<b>Vorname<b> <input type='text' id='vorname' value='' onKeyPress="eintippen(event)">
<input type='button' id='knopf' value='Anzeigen' onClick="send_to_server()">
</td></tr>
<tr><td align='center'> <hr>Bitte Zuname und Vorname eingeben.</td></tr>
</form>
</table>
</div>
</div>
<div id="ort_der_antwort" style="position:absolute; top:250px; left:0px; width:200px; height:20; background-color:yellow;">
</div>
</body>
</html>