Formular-Textfelder, -Checkboxen und -Radiobuttons mit JavaScript und PHP abfragen

Kontakt-, Bestell- und ähnliche Formulare auf Webseiten werden meist mit Hilfe von PHP ausgewertet und die enthaltenen Daten dann als E-Mail verschickt und/oder in einer Datenbank gespeichert.

Auch JavaScript kann zur Überprüfung der Formularfelder im Browser des Internetnutzers hilfreich sein.

Hier eine kleine Zusammenfassung, wie Textfelder, Checkboxen und Radiobuttons innerhalb von Formularen mit JavaScript und PHP abgefragt werden können.

Textfelder

Ein Beispiel:

<form id="kontaktformular" method="post" action="<?=$_SERVER['PHP_SELF'];?>">
Vorname: <input type="text" id="vorname" value="Felix" />
<textarea id="nachricht">Das ist meine Nachricht.</textarea>
</form>

JavaScript

In JavaScript können Textfelder von Formularen innerhalb des Browsers über die dem Formular und Textfeldern vergebenen IDs ausgelesen werden, und zwar so:

var vorname = document.kontaktformular.vorname.value;
var nachricht = document.kontaktformular.nachricht.value;

PHP

In PHP werden nach dem Senden des Formulars aus dessen Werten Variablen erzeugt, welche zur weiteren Benutzung zur Verfügung stehen.

register_globals = on

Ist PHP mit register_globals = on konfiguriert, so wird für jedes übergebene Formularfeld eine Variable mit demselben Namen generiert.

Aus der ID wird der Variablenname.
Der Variablenwert entspricht dann dem eingegebenen Text.

o.g. Beispiel erkennt PHP als

$vorname = “Felix“;
$nachricht = “Das ist meine Nachricht.“

D.h. mit den Werten der Formularfelder “vorname” bzw. “nachricht” kann nach Absenden des Formulars über die Variablen $vorname bzw. $nachricht im PHP-Script weitergearbeitet werden.

register_globals = off

Ist PHP mit register_globals = off konfiguriert, so kann auf die Variablen über das superglobale Array $_POST zugegriffen werden (natürlich nur, wenn das Formular per method=”post” versendet wurde):

$vorname = $_POST[’vorname’];
$nachricht = $_POST[’nachricht’];

Nicht-gruppierte Checkboxen

Checkboxen können entweder einzeln oder mit anderen Checkboxen gruppiert in ein Formular integriert werden.

Typisches Beispiel für eine nicht-gruppierte Checkbox:

<form id="bestellformular">
<input type="checkbox" name="agb" id="agb" /> Ich akzeptiere die AGB.
</form>

JavaScript

Mit folgendem JavaScript-Code kann man nun abfragen, ob die Checkbox markiert wurde:

if (document.bestellformular.agb.checked == true) {
  alert(’AGB akzeptiert’);
}

PHP

In PHP steht die Variable einer nicht-gruppierten Checkbox nach dem Senden des Formulars nur dann zur Verfügung, wenn sie zuvor ausgewählt bzw. markiert wurde.

Das bedeutet, dass es ausreicht, zu fragen, ob die Variable nach dem Senden in PHP initiiert wurde oder nicht.

Der Einfachheit halber hier (und im Folgenden) nur der Code für die PHP-Konfiguration mit register_globals = on (s.o.) :

<?php
  if(isset($agb)) {
    echo "AGB akzeptiert";
  }
?>

Gruppierte Checkboxen und Radiobuttons

Checkboxen und Radiobuttons können gruppiert werden, indem ihnen das gleiche name-Attribut vergeben wird. Im value-Attribut steht dann der jeweils zugewiesene Wert der Checkbox oder des Radiobuttons.

Beispiel für gruppierte Checkboxen:

<form name="bestellformular" method="post" action="">
   Bitte senden Sie mir Informationen &uuml;ber
   <input type="checkbox" name="infosendung" id="infosendung"
   value="Hotels">
   Hotels
   <input type="checkbox" name="infosendung" id="infosendung"
   value="Hausboote">
   Hausboote
   <input type="checkbox" name="infosendung" id="infosendung"
   value="Pensionen">
</form>

Beispiel für gruppierte Radiobuttons:

<form name="kontaktformular" method="post" action="">
 Anrede:
 <input type="radio" name="anrede" value="Herr">
 Herr
 <input type="radio" name="anrede" value="Frau">
 Frau
</form>

JavaScript

Mit JavaScript kann nun der Zustand jeder Checkbox bzw. jedes Radiobuttons ausgelesen werden.

Leider kann man hier nicht direkt auf die Werte bspw. über das value-Attribut zugreifen.
Man macht sich aber zunutze, dass gruppierte Checkboxen bzw. Radiobuttons der Reihenfolge ihres Vorkommens im Quellcode nach in ein Array mit dem Namen des gemeinsamen name-Attributs gespeichert werden. Über dieses Array kann dann der Zustand der Checkboxen und Radiobuttons der Reihe nach abgefragt werden.

Beispiel Checkboxen:

if ( document.bestellformular.infosendung[0].checked == true ) {
  alert(’Informationen über Hotels‘);
};
if ( document.bestellformular.infosendung[1].checked == true ) {
  alert(’Informationen über Hausboote‘);
};
if ( document.bestellformular.infosendung[2].checked == true ) {
  alert(’Informationen über Pensionen‘);
};

Beispiel Radiobuttons:

if ( document.kontaktformular.anrede[0].checked == true ) {
  alert(’Herr‘);
}
if ( document.kontaktformular.anrede[1].checked == true ) {
  alert(’Frau‘);
}

PHP

In PHP kann man nun auch direkt auf die Value-Attribute der gesendeten Check- und Radiobuttons zugreifen.

Hier kann wie bei den nicht-gruppierten Checkboxen zuerst einmal überprüft werden, ob überhaupt ein Element aus den gruppierten Checkboxen oder Radiobuttons ausgewählt wurde.

Ist dies nicht der Fall, so sind die Variablen, welche aus den gemeinsam vergebenen name-Attributen generiert werden, nicht existent.

Für unsere Beispiele:

if ( isset($infosendung) ) {
  echo "Ein oder mehrere Elemente aus der Gruppe ‘infosendung’ wurde(n) ausgewählt";
}
if ( !isset($anrede) ) {
 echto "Sie haben keine Anrede ausgewählt."
}

Doch nun zur Abfrage der einzelnen Radiobuttons bzw. Checkboxen.

RADIOBUTTONS

Von gruppierten Radiobuttons kann jeweils nur ein einziger ausgewählt werden.
Wird ein zweiter aktiviert, so wird der vorher ausgewählte automatisch abgewählt.

Das bedeutet, dass bei Empfang des Formulars in PHP eine Variable mit dem Namen des name-Attributes und dem Wert (value) des aktiven Radiobuttons erzeugt wird.

Dann kann gefragt werden:

<?php
  if ( $anrede == "Herr" ) {
    echo "Sehr geehrter Herr";
  } else if ( $anrede == "Frau" ) {
    echo "Sehr geehrte Frau";
  }
?>

CHECKBOXEN

Werte ausgewählter gruppierter Checkboxen hingegen werden wie bei JavaScript in einem Array gespeichert, welches den Namen des name-Attributs der Checkboxen trägt.

Die Werte können dann zum Beispiel so ausgegeben werden:

$info_bestellung = “Sie haben folgende Informationen bestellt:
“;

for ( $i=0; $i < count($infosendung); $i++ ) {
  if ($infosendung[$i] != "") {
    $zaehler = $i + 1;
    $info_bestellung .= "$zaehler. $infosendung[$i] <br />";
  }
}

Wären in unserem Beispiel der gruppierten Checkboxen (s.o.) alle Checkboxen markiert, würde folgender Text ausgegeben werden:

Sie haben folgende Informationen bestellt:
1. Hotels
2. Hausboote
3. Pensionen

Submit-Buttons

Eine weitere häufig auftretende Frage ist, wie abgefragt werden kann, mit welchem Submit-Button ein Formular übermittelt wurde, wenn innerhalb des Formulares mehrere Submit-Buttons definiert wurden. (um zum Beispiel verschiedene Funktionalitäten auszuführen)

Angenommen wir haben ein Formular mit den Buttons “Überprüfen” und “Abschicken”:

<form name="formular" action="<?=$_SERVER['PHP_SELF'];?>" method="post">
  <input name="ueberpruefen" type="submit" value="Ueberpruefen"><br />
  <input name="abschicken" type="submit" value="Abschicken">
</form>

PHP

In PHP wird nur für denjenigen Button eine Variable erzeugt, der das Senden des Formulars ausgelöst hat.
Welcher dies ist, kann damit überprüft werden, indem man die Existenz der entsprechenden Variable abfragt:

<?php
  if (isset($ueberpruefen)) {
    ueberpruefen();
  }
  if (isset($abschicken)) {
    abschicken();
  }
?>

Verwandte Beiträge

• Barrierefreiheit von Webseiten testen
• Bequeme Pfadangaben in Wordpress-Templates
• DOM-ROLLOVER auf Basis von DOM-Scripting und unobtrusive JavaScript
• Wordpress: Inhalte im xten Post anzeigen
• flickr-RSS-Feeds in Wordpress anzeigen
• Verwendung des label-Elements bei Radio- und Checkboxen innerhalb von Formularen
• Min-width-Lösung für den Internet Explorer mit purem CSS - von Stu Nicholls

Dienstag, 18. Juli 2006 12:18 Uhr in Artikel, PHP 7 Kommentare
Kommentar-Abo kommentieren | TrackBack-URI