öffentlich
Redaktion Druckversion

HTML lernen (3): Formulare einbinden

4.666665
(3)
Beitrag bewerten
Kommentar schreiben
Stand: 1. September 2007

Radiobuttons

<input type="radio"> definiert einen Radiobutton.

Gültige Attribute

Radiobuttons sind ähnlich aufgebaut wie die Checkbuttons. Der Unterschied besteht darin, dass aus einer Gruppe von Radiobuttons nur ein Element ausgewählt werden kann, ähnlich den Stationstasten bei einem Radio. Eine Mehrfachauswahl ist nicht möglich.

Folgende Attribute stehen zur Verfügung:

  • type="radio"

    Definiert als Feldtyp einen Radiobutton.

  • name="computer"

    Weist dem Radiobutton einen Variablennamen zu. Es sind nur Buchstaben und Zahlen erlaubt, weder Leerzeichen noch Sonderzeichen dürfen verwendet werden. Bei einer Gruppe muss allen Radiobuttons der gleiche name zugewiesen werden.

  • value="cd"

    Ist ein Element ausgewählt, wird bei der Übertragung des Formulars der value-Wert übertragen. Ist das Element nicht ausgewählt, wird es bei der Übertragung übergegangen.

  • checked

    Diese Angabe ist optional. Ist das Attribut gesetzt, wählt der Browser das Element automatisch aus. Es wird zurückgesetzt, wenn der Benutzer einen anderen Radiobutton der gleichen Gruppe anklickt.

Beispiel: Radiobuttons

Klicken Sie hierAnzeigen, und sehen Sie eine Gruppe von Radiobuttons. Da es sich um eine Gruppe handelt, wird allen Radiobuttons im HTML-Code (siehe unten) der gleiche Name zugewiesen. Auch in diesem Beispiel ist wieder das erste Element voreingestellt. Das wird durch das eingesetzte Attribut checked erreicht.

Der HTML-Code sieht folgendermaßen aus:

<p><b>Welcher HTML-Editor gefällt Ihnen am besten?</b></p>

<form method="POST">
  <p><input type="radio" checked name="editor" value="homesite">Homesite</p>
  <p><input type="radio" name="editor" value="webedit">Webedit </p>
  <p><input type="radio" name="editor" value="frontpage">FrontPage</p>
  <p><input type="radio" name="editor" value="keiner">keiner</p>
</form>

Der dargestellte HTML-Code zeigt wieder den relevanten Teil des Beispiels, auf die Darstellung der Ihnen schon bekannten Tags wie <head>, <body>, <title> usw. haben wir verzichtet.

Mitglied werden, Vorteile nutzen!

  • Sie können alles lesen und herunterladen: Beiträge, PDF-Dateien und Zusatzdateien (Checklisten, Vorlagen, Musterbriefe, Excel-Rechner u.v.a.m.)
  • Unsere Autoren beantworten Ihre Fragen

Downloads zu diesem Beitrag

Über die Autorin:

bild117238

Kerstin Dankwerth arbeitet seit 1996 als Grafikerin und Web-Entwicklerin im Netz. Zu ihren Stammkunden gehören u.a. akademie.de, 104I9 OldieStar Radio, FDP Berlin,

Newsletter abonnieren