Hartmut Birkholz - Webdesign

Hartmut Birkholz - Webdesign

Diese Seite schaut viel besser in einem Browser aus, der Web-Standards unterstützt, die Seite ist aber für jeden Browser geeignet. Trotzdem empfehle ich den Download z.B. des Firefox, Opera oder Internet Explorers.

Textfelder prüfen

Die Formulardaten können mittels einer neu angelegten Funktion abgefragt werden. Zunächst benutzen wir hierzu eine alert-Anzeige, um zu sehen, was passiert. Ich werde die Funktion zeigeDaten() nennen und sie soll aufgerufen werden, sobald ein Benutzer auf den Abschicken-Button klickt.
<input type="submit" value="Abschicken" onclick="zeigeDaten() "/>

Diese Funktion muss nun definiert werden. Zunächst muss auf das Formular zugegegriffen werden. Das geschieht mit dem document-Objekt. Wir brauchen das Array document.forms, welches sämtliche Formulare einer Seite enthält. Wir geben die Nummer des gewünschten Formulars an, die Zählung beginnt wie gehabt bei 0:
function zeigeDaten(f) {
var f = document.forms[]

Als nächstes muss über ein weiteres Array - f.elements - auf die Formularfelderfelder zuggriffen werden. Statt der Nummer des Elements kann auch dessen Name angegeben werden, z.B.
f.elements ["Name"], wenn ein einzeiliges Textfeld mit dem Namen "Name" existiert.
Den Wert, also den "Inhalt" fragt man mit value ab. Das sieht dann so aus:
var ausgabe = "Textfeld: " +
f.elements["Name"].value;

Es empfiehlt sich, die abgerufenen Werte über ein Popup-Fenster mit alert() aufzurufen und nicht mit document.write, da sonst die Werte überschrieben werden:
alert (ausgabe);

Schneller Zugriff auf Formulare

Wenn für zeigeDaten() als Parameter in einem Formular this.form definiert wird, erfolgt der Funktionszugriff automatisch auf dieses Formular. In der Funktion kann dann statt
function zeigeDaten () {
var f = document.forms [0];

einfach
function zeigeDaten (f) {
geschrieben werden.
Damit spart man sich eine Zeile Code und kann sich zudem auch noch sicher sein, auf das richtige Formular zuzugreifen.

Name:
 

Ein zweites Textfeld:

Die Prüfung folgt analog, die Ausgabe erfolgt dann durch Addition zum ersten Textfeldes. Um eine neue Zeile zu erzeugen, kann statt eines "<br />" + auch innerhalb des JavaScript-Cods der Slash \n erfolgen:
ausgabe += "\nVorname: " + f.elements["Vorname"].value;

Vorname:
Name:
 

Und jetzt alle Textfelder

Vorname:
Name:
Passwort:
Straße:
Hausnummer:
Postleitzahl:
Ort:
E-Mail:
Homepage:
Deine Nachricht:
 
<-- Das Formular Der Rest -->