*** Formulare ***  

<form method="get"
         action="Programm.xxx">
   :
   :
</form>

<form method="post"
         action="mailto:xy@domain.de"
         enctype="text/plain">
   :
   :
</form>

      

   :
   :
      

Der <form>-Tag selbst hat keine Darstellung - allerdings kann man ihm mit StyleSheets einen Rahmen und eine Hintergrundfarbe zuweisen.

Mit dem <form>-Tag werden die zu einem Formular gehörenden Eingabefelder gebündelt.

action= enthält den Namen des Programms, das die Daten verarbeiten soll ... -oder-
eine mailto:-Anweisung, falls die Daten per E-Mail verschickt werden sollen.

method= bestimmt die Art der Datenübergabe:

method="get" Die Daten werden als Parameter an die Adresse des aufzurufenden Programms angehängt. Die Anzahl der Zeichen ist je nach Server auf ca. 2000 begrenzt.

method="post" Die Daten werden dem aufzurufenden Programm über den Standard-Eingabekanal zur Verfügung gestellt (so z.B. wenn die Daten per E-Mail verschickt werden sollen). Eine Zeichenbegrenzung gibt es nicht.

enctype="text/plain" bestimmt die Art der Darstellung beim Versand der Daten per E-Mail.

Der Versand der Daten als E-Mail funktioniert nicht zuverlässig, da dies vom installierten Mail-Programm des Users abhängt.

<form ..... >
<p> User-Id: <br/>
<input type="text" name="UserId"
       value="Nickname"
       size="20"/></p>

<p> Passwort: <br/>
<input type="password" name="PassCode"
       size="10" maxlenght="10"/><br/>
<input type="checkbox" name="PassSave">
       Passwort speichern?</p>
      

<p> Status:
<input type="text" name="UserStatus"
       value="Stammgast"
       readonly="readonly"
       size="10"/></p>
      

<input type="radio" name="MyWay"
       value="Comm" checked="checked"/>
       Community
<input type="radio" name="MyWay"
       value="Forum"/> Forum
<input type="radio" name="MyWay"
       value="Chat"/> Chat
<input type="radio" name="MyWay"
       value="Guest"/> Gästebuch
      

<input type="hidden" name="Privat"
       value="verborgen"/>
      

<input type="submit"
       value="abschicken"/>

<input type="reset"
       value="Formular löschen"/>
      

 <input type="file" name="Upload"
       size="3"/>

<input type="button"
       value="Start Programm"
       onClick="... (Script) ..."/>
      

<input type="image" name="Position"
       src="Bilder/SunFlower.gif"/>
</form>
      

Mit StyleSheets kann man das Aussehen der Eingabefelder bestimmen.

Mit dem <input>-Tag wird ein einzeiliger Text oder eine Auswahl angefordert.

type= bestimmt die Art der Darstellung des Eingabefeldes.

type="text" = einfaches Textfeld; der Inhalt wird dargestellt (Vorgabe).

type="passwort" = Passwort-Feld. Der Inhalt ist am Bildschirm nicht zu lesen, wird aber unverschlüsselt weiterverarbeitet.
Verschlüsselte Übertragung erfolgt via HTTPS-Protokoll.

type="checkbox" = ja/nein-Auswahlfeld; man kann ein Häkchen setzen bzw.löschen.

type="radio" = Schaltknopf. Zusammengehörende Schaltknöpfe, von denen nur einer "ON" sein kann, erhalten unter name= den selben Namen.

type="hidden" = Informations-Feld. Der Inhalt wird mit versendet, ist aber für den User nicht sichtbar. Das Feld könnte z.B. von einem Verarbeitungsprogramm befüllt werden, bevor das Formular versendet wird.

type="submit" = Versende-Button. Bei "Klick" werden die eingetragenen Info's per Mail verschickt oder das für das Formular vorgesehene Verarbeitungsprogramm gestartet.

type="reset" = Reset-Button. Bei "Klick" werden alle Formulardaten gelöscht.

type="file" = Feld zum Datei-Upload. Funktoniert nur mit method="post".

type="button" = Start-Button mit eigener Beschriftung.

type="image" = Versende-Button bzw. Start-Button als Bild.

name="..." ordnet dem Eingabefeld bzw. der Auswahl einen Namen zu, mit dem es in den Verarbeitungsprogrammen angesprochen werden kann.

value="..." ordnet dem Eingabefeld bzw. der Auswahl einen Namen zu, mit dem es in den Verarbeitungsprogrammen angesprochen werden kann.

size="..." bestimmt die Anzahl der Zeichen, die angezeigt werden sollen.

maxlength="..." bestimmt die Anzahl der Zeichen, die die Eingabe enthalten kann.

readonly="readonly" bedeutet, daß der Inhalt nicht verändert werden kann.
Funktioniert bei älteren Browsern nicht.

<form ..... >
  :
<div> Nachricht:</div>
<textarea name="Nachricht"
      cols="20" rows="8"/>
      Eingabe hier ... </textarea>
  :
<div> AGBs:</div>
<textarea name="AGBs"
      cols="40" rows="2"
      readonly="readonly"/>
      Teilnahme-Bedi... </textarea>
  :
</form>

      

Mit StyleSheets kann man das Aussehen der Eingabefelder bestimmen.

Mit dem <textarea>-Tag wird ein längerer Text angefordert, Zeilenumbruch mit "Enter".
Die Länge des Textes ist theoretisch unbegrenzt. (siehe <form>-Tag)

Ein Vorgabe-Text kann zwischen <textarea> und </textarea> definiert werden. Zeilenumbrüche und Leerzeichen werden dabei wie definiert dargestellt. Formatierungs-Tags wie z.B. <b> sind nicht erlaubt, Sonderzeichen wie "<" oder ">" sind verschlüsselt zu notieren.

cols= bestimmt die Breite des Eingabefeldes, Anzahl von Zeichen pro Zeile.

rows= bestimmt die Länge des dargestellten Eingabefeldes, Anzahl von Zeilen.
Dies hat keinen Einfluß auf die Länge des Textes - die meisten Browser stellen das Feld mit "Scrollbalken" dar, damit der User den anzuzeigenden Textabschnitt auswählen kann (scrollen).

name="..." ordnet dem Eingabefeld einen Namen zu, mit dem es in den Verarbeitungsprogrammen angesprochen werden kann.

readonly="readonly" bedeutet, daß der Inhalt nicht verändert werden kann.
Funktioniert bei älteren Browsern nicht.