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.

The Rest of the Best

Es sieht gut aus, unser Kontaktformular, jetzt kommen die schweren Kleinigkeiten...

Checkboxen

Mit JavaSccript lässt sich auch überprüfen, ob Checkboxern aktiviert, d.h. angeklickt wurden. Das erfolgt mit der Funktion Eigenschaft "checked".
f.elements ["Kapiert"].checked

Mit if-else-Anweisung

Mit einer if-else-Anweisung könnte man für die beiden möglichen Fälle, dass die Bedingung (Kapiert) erfüllt ist (true) oder nicht (false), eine entsprechende Ausgabe formulieren.
if (f.elements[Kapiert].checked == true {
ausgabe += "\nSinn verstanden? Voll kapiert!";
} else {
ausgabe += "\nSinn verstanden? Nicht kapiert!";

Kurzschreibweise

Statt der if-else-Anweisung kann man auch eine deutlich kürzere Schreibweise wählen. Dazu gibt man wie gehabt die Bezeichnung des Formularfeldes aus, allerdings ohne den Wert:
ausgabe += \nSinn verstanden? ";

Darunter kommt nun das, was ausgegeben werden soll, wenn die Checkbix "kapiert" aktiviert ist oder nicht:
ausgabe += "\nSinn verstanden? " + ((f.elements["Kapiert"].checked) ? "Voll kapiert!" : "Nicht kapiert!");
Dahinter steckt also das Schema: (Bedingung) ? "Wert1" "Wert2";

Sinn verstanden? Voll kapiert!
 

Radio-Button prüfen

Wenn man mit f.elements{"Name des Radio-Buttons} zugreift, dann hat man ein Array mit den Werten aller Radio-Buttons. Um die einzelnen Elemente zu "checken", muss man zusätzlich über den Index darauf zugreifen:
f.elements["Anrede"] [0].checked
prüft das 1. Element des Arrays, also den ersten Radio-Button.
Alle Buttons können also mit einer if-else-Anweisung abgefragt werden. Nicht vergessen darf man hierbei, dass auch eine Abfrage für den nicht aktivierten Button erfolgen muss.

Anrede: Herr Frau Firma
 

Die Auswahlliste

Bei Auswahllisten kann man sich wie gehabt den Wert über value ausgeben lassen oder mit selectedIndex die Nummer des gewählten Elements.
Bei Auswahllisten mit Mehrfachauswahl muss ein anderer Weg gewählt werden, weil value und selectedIndex jeweils nur das erste gewählte Element ausgeben und eben nicht alle. Hier nutzt man das Array options, das alle Elemente der Auswahlliste enthält, und prüft mit einer for-Schleife jedes dieser Elemente, bis das Array erreicht ist:
for (var i=0; i< f.elements.["Interessen"].options.length; i++) {

In einer if-Anweisung schreibt man dann, dass ein ausgewähltes (selected-Eigenschaft) Element ausgegeben werden soll:
if (f.elements.["Interessen"].options.[i].selected)
{
ausgabe += f.elements.["Interessen"].options.[i].value + " ";
}
}

Wohnland
Lust und Laune
Mehrfachauswahl
mit STRG &
Maus möglich:
 

Das ganze Formular

Jetzt können wir endlich alle Felder prüfen:

Anrede: Herr Frau Firma
Vorname:
Name:
Passwort:
Straße:
Hausnummer:
Postleitzahl:
Ort:
Wohnland
E-Mail:
Homepage:
Deine Nachricht:
Lust und Laune
Mehrfachauswahl
mit STRG &
Maus möglich:
Sinn verstanden? Ja! Voll kapiert!
 
   
<-- Textfelder Abschließende Prüfung-->