Java Reference
In-Depth Information
Listing 12.16■ Das Webformular zur Eingabe von Userid und Passwort
...
<script src="lib/js/kap12_7.js" type="text/javascript"></script>
</head>
<body>
<h1>Geben Sie Ihre Zugangsdaten ein</h1>
<form><div class="titel">Userid:</div>
<input type="text" id="user" name="user"/><br />
<div class="titel">Passwort:</div>
<input type="password" id="pw" name="pw"/></form><hr />
<button id="frage">Daten Wegschicken</button>
<button id="zurueck">Zurücksetzen</button><div id="info"></div>
</body>
</html>
Das Webformular unterscheidet sich nur unwesentlich von den bisherigen Varianten. Es
gibt zwei einzeilige Eingabefelder (eines davon ist ein Passwortfeld) und neben der Schalt-
läche, die wir zum Verschicken der Daten verwenden wollen, gibt es eine Schaltläche zum
Zurücksetzen des Formulars. Beide werden mit dem <button> -Tag umgesetzt. Die Benutzer-
eingaben werden wie folgt plausibilisiert (kap12_7.js):
Listing 12.17■ Kontrolle von zwei Eingabefeldern beim Verlassen des Formulars
function maxAnzahl() {
var f = document.forms[0];
if (f.user.value.length < 8) { // Kontrolle Userid
document.getElementById("info").innerHTML =
"Die Userid hat zu wenig Zeichen";
f.user.value = "";
f.user.focus();
return false;
}
if (f.pw.value.length < 10) { // Kontrolle Passwort
document.getElementById("info").innerHTML =
"Das Passwort besteht aus mindestens 10 Zeichen";
f.pw.value = "";
f.pw.focus();
return false;
}
f.action = "info.php";
f.submit();
}
function zuruecksetzen() {
if (conirm("Das Formular wird zurückgesetzt.\nSind Sie sicher?")) {
document.forms[0].reset();
document.getElementById("info").innerHTML = "";
return false;
}
return false;
}
function init() {
document.getElementById("frage").onclick = maxAnzahl;
document.getElementById("zurueck").onclick = zuruecksetzen;
}
window.onload = init;
 
Search WWH ::




Custom Search