Über Dekoratoren gestaltetes Kontaktformular
Veröffentlichungsdatum: 05. August 2010
Änderungsdatum: 21. Juni 2021
Anwendungsbeispiel: Gestaltetes Kontaktformular, bei dem die Elemente individuell platziert und die Styleangaben direkt an die Elemente übergeben wurden
Formular
Beispiel: Gestaltetes Beispielformular
Quelltext
<?php
//$formular = new wForm();<br>
$formular = new wForm(array('decorators' => array(
'form' => '<dl class="form">')));
$formular->addElement('input', 'name', 'Name*', array('attributes' => array('class' => 'L'), 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte geben Sie einen Namen an'))));
$formular->addElement('input', 'street', 'Strasse*', array('attributes' => array('class' => 'L'), 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte geben Sie eine Strasse an'))));
$formular->addElement('input', 'streetNumber', 'Hausnr.*', array('attributes' => array('class' => 'XS'), 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte geben Sie eine Hausnummer an'))));
$formular->addElement('input', 'zip', 'PLZ*', array('attributes' => array('class' => 'XS'), 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte geben Sie eine gültige Postleitzahl an'))));
$formular->addElement('input', 'town', 'Stadt*', array('attributes' => array('class' => 'L'), 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte geben Sie eine Stadt an'))));
$formular->addElement('input', 'email', 'E-Mail*', array('attributes' => array('class' => 'L'), 'validators' => array(array('type' => 'email', 'errorMessage' => 'Bitte geben Sie eine gültige E-Mail Adresse an'))));
$formular->addElement('select', 'type', 'Typ*', array('attributes' => array('class' => 'L'), 'options' => array('' => 'Bitte wählen Sie Ihren Status aus', 'customer' => 'Kunde', 'prospect' => 'Interessent'), 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte wählen Sie Ihren Status aus.'))));
$formular->addElement('submit', 'submit', 'Absenden');
$formular->addEventServer('onSubmit', '
$this->setFormData(wRequest::getParameters());
if($this->validate()){
$this->initFormData();
$this->setStatus("sent");
wResponse::redirect($this->url);
}
else{
$this->setStatus("failed");
wResponse::redirect($this->url);
}
');
if($formular->getStatus() == 'sent'){
print '<div style="padding:8px;background-color:#ffffff;border:solid 1px #666666">Vielen Dank für Ihre Anmeldung!</div>';
$formular->setStatus("");
}
else{
if($formular->getStatus() == 'failed'){
$formular->setStatus("");
}
$formular->show();
}
?>Ergebnis
FAQs
- Wie kann ich ein Kontaktformular mit Decorators anpassen?
- Du kannst beim Erstellen des Formulars einen Decorator für den Formular-Container übergeben, z. B. im Konstruktor von <code class="codeInline">wForm</code>: <pre><code class="codeBlock" style="color: #000000">php $formular = new wForm(array('decorators' => array( 'form' => '<dl class="form">' ))); </code></pre>
- Wie werden Formularelemente im Beispiel hinzugefügt?
- Im Beispiel werden einzelne Felder über <code class="codeInline">addElement</code> registriert, z. B. ein <code class="codeInline">input</code>-Feld für den Namen: <pre><code class="codeBlock" style="color: #000000">php $formular->addElement('input', 'name', 'Name*', array( 'attributes' => array('class' => 'L'), 'validators' => array(array( 'type' => 'required', 'errorMessage' => 'Bitte geben Sie einen Namen an' )) )); </code></pre>
- Welche Validatoren werden im Beispiel verwendet?
- Das Beispiel nutzt vor allem zwei Validator-Typen: - <code class="codeInline">required</code> (Pflichtfeld) mit passender <code class="codeInline">errorMessage</code> - <code class="codeInline">email</code> (E-Mail-Validierung) mit entsprechender <code class="codeInline">errorMessage</code> Beispiel E-Mail: <pre><code class="codeBlock" style="color: #000000">php $formular->addElement('input', 'email', 'E-Mail*', array( 'attributes' => array('class' => 'L'), 'validators' => array(array( 'type' => 'email', 'errorMessage' => 'Bitte geben Sie eine gültige E-Mail Adresse an' )) )); </code></pre>
- Wie werden Select-Optionen für ein Feld (z. B. Typ/Status) definiert?
- Mit <code class="codeInline">addElement('select', ...)</code> und einer <code class="codeInline">options</code>-Liste. Zusätzlich wird mit <code class="codeInline">validators</code> sichergestellt, dass eine Auswahl getroffen wird. <pre><code class="codeBlock" style="color: #000000">php $formular->addElement('select', 'type', 'Typ*', array( 'attributes' => array('class' => 'L'), 'options' => array( '' => 'Bitte wählen Sie Ihren Status aus', 'customer' => 'Kunde', 'prospect' => 'Interessent' ), 'validators' => array(array( 'type' => 'required', 'errorMessage' => 'Bitte wählen Sie Ihren Status aus.' )) )); </code></pre>
- Wie kann ich beim Absenden des Formulars serverseitig validieren und danach reagieren?
- Im Beispiel wird ein <code class="codeInline">onSubmit</code>-Event verwendet. Dabei werden Formularwerte gesetzt, validiert und je nach Ergebnis der Status gesetzt sowie eine Redirect-Aktion durchgeführt. <pre><code class="codeBlock" style="color: #000000">php $formular->addEventServer('onSubmit', ' $this->setFormData(wRequest::getParameters()); if($this->validate()){ $this->initFormData(); $this->setStatus("sent"); wResponse::redirect($this->url); } else{ $this->setStatus("failed"); wResponse::redirect($this->url); } '); </code></pre>
- Was passiert im Beispiel, wenn das Formular erfolgreich gesendet wurde?
- Wenn <code class="codeInline">getStatus()</code> auf <code class="codeInline">'sent'</code> steht, wird eine Dankesmeldung ausgegeben und der Status wieder zurückgesetzt. <pre><code class="codeBlock" style="color: #000000">php if($formular->getStatus() == 'sent'){ print '<div style="padding:8px;background-color:#ffffff;border:solid 1px #666666">Vielen Dank für Ihre Anmeldung!</div>'; $formular->setStatus(""); } </code></pre>
- Was passiert, wenn die Validierung fehlschlägt?
- Wenn <code class="codeInline">getStatus()</code> auf <code class="codeInline">'failed'</code> steht, wird der Status im else-Zweig zurückgesetzt, sodass das Formular erneut angezeigt werden kann (inkl. Validierungsfehlern). <pre><code class="codeBlock" style="color: #000000">php else{ if($formular->getStatus() == 'failed'){ $formular->setStatus(""); } $formular->show(); } </code></pre>
- Wann und wie wird das Formular angezeigt?
- Das Formular wird im Beispiel im <code class="codeInline">else</code>-Block mit <code class="codeInline">$formular->show();</code> ausgegeben. Bei <code class="codeInline">'sent'</code> erfolgt stattdessen die Anzeige der Erfolgsmeldung.