Umfangreiches Bestellformular

Anwendungsbeispiel: Formular mit allen verfügbaren Elementen

Umfangreiches Bestellformular

Beispiel: Umfangreiches Bestellformular

Quelltext

<?php

$formular = new wForm();

$formular->addElement('radio', 'salutation', 'Anrede*', array('attributes' => array('class' => 'wglRadioFloat'), 'options' => array('Herr' => 'Herr', 'Frau' => 'Frau'), 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte wählen Sie Ihre Anrede aus.'))));
$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' => 'M'), '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' => 'M'), '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', 'found', '', array('attributes' => array('class' => 'L'), 'options' => array('' => 'Wie haben Sie uns gefunden?', 'Über das Internet' => 'Über das Internet', 'In  Printmedien' => 'In  Printmedien')));

$frameworkClasses = array();

$query              = array();
$query['dir']      = '/dev/dokumentationen/framework/klassen';
$query['orderBy']   = '/wd:extension/wd:meta/wd:title/text()';
$query['orderDir']  = 'asc';

$result = wRepository::selectDocuments($query);

foreach($result as $document){
  $frameworkClasses[$document] = '';
}

$formular->addElement('checkbox', 'classes', '', array('attributes' => array('class' => 'wglCheckboxFloat'), 'options' => $frameworkClasses, 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte wählen Sie mindestens eine Klasse aus.'))));
$formular->addElement('selectMulti', 'format', 'Format*', array('attributes' => array('style' => 'width:100%'), 'options' => array('print' => 'gedruckt', 'pdf' => 'PDF', 'html' => 'HTML'), 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte wählen Sie mindestens Format aus.'))));
$formular->addElement('textarea', 'text', 'Kommentar', array('attributes' => array('class' => 'L')));
$formular->addElement('radio', 'payment', 'Zahlweise*', array('options' => array('pre' => 'Vorkasse', 'paypal' => 'Paypal', 'bill' => 'Rechnung'), 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte wählen Sie Ihre Anrede aus.'))));
$formular->addElement('checkbox', 'furtherInfo', 'Zukünftiger Kontakt', array('options' => array('mail' => 'Sie dürfen mich per Mail kontaktieren', 'telefon' => 'Sie dürfen mich per Telefon kontaktieren', 'brief' => 'Sie dürfen mich per Post kontaktieren'), 'validators' => array()));
$formular->addElement('checkbox', 'generalTerms', '', array('attributes' => array('class' => 'wglCheckboxFloat'), 'options' => array('read' => ''), 'validators' => array(array('type' => 'required', 'errorMessage' => 'Bitte bestätigen Sie, dass Sie die Allgmeinen Geschäftsbedingungen gelesen haben.'))));
$formular->addElement('captcha', 'captcha', 'Bitte geben Sie diesen Text in das Feld ein', array('attributes' => array('style' => 'float:left', 'value' => rand(1000, 9999), 'height' => 16, 'quality' => 5)));
$formular->addElement('input', 'captchaInput', 'Sicherheitsabfrage', array('attributes' => array('class' => 'S'), 'validators' => array(array('type' => 'captcha', 'errorMessage' => 'Der eingegebene Wert stimmte nicht mit dem Wert auf dem Bild überein.'))));
$formular->addElement('submit', 'submit', 'Absenden');

$formular->setVar('mailStr', 'From: [!--email--]
MIME-Version: 1.0
To: test@cmsedit.de
Subject: Neue Bestellung
Content-Type: text/plain; charset=UTF-8;

Sie haben die Bestellung über [!--url--] erhalten:

Anrede:     [!--salutation--]
Name:       [!--name--]
Strasse:    [!--street--] [!--streetNumber--]
PLZ / Ort:  [!--zip--] [!--town--]

E-Mail:     [!--email--]

Gefunden über: [!--found--]
Darf kontaktiert werde per: [!--furtherInfo--]

Kommentar: [!--text--]

Gewünschte Klassen:
[!--classes--]

In den Formaten: [!--format--]

Zahlungsart: [!--payment--]

');

$formular->setVar('mailStrCustomer', 'From: test@cmsedit.de
MIME-Version: 1.0
To: [!--email--]
Subject: Ihre Bestellung
Content-Type: text/plain; charset=UTF-8;

Sehr geehrte(r) [!--salutation--] [!--name--]

Sie haben die Dokumentation zu folgende Klassen in den Formaten [!--format--] bestellt:
[!--classes--]

Vielen Dank für Ihre Bestellung. Wir werden diese schnellstmöglich bearbeiten.

Ihr Weblication Team

');

$formular->addEventServer('onSubmit', '
  $this->setFormData(wRequest::getParameters());
  if($this->validate()){ 
    $mailData = $this->getFormData();
    $mailData[\'url\'] = $this->url;
    
    wMailer::sendMailStr($this->getVar("mailStr"), $mailData);
    wMailer::sendMailStr($this->getVar("mailStrCustomer"), $mailData);
    $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 Bestellung!</div>';
  $formular->setStatus("");  
}
else{
  if($formular->getStatus() == 'failed'){
    $formular->setStatus(""); 
  }
  
  $formular->build();

?>
<div class="elementForm">
  <form name="frmDefault" method="POST" action="<?php print $formular->action; ?>">
    <h3>Framework Klassen bestellen</h3>
    <?php
      if(!$formular->validate()){
        print '<div class="errorMessages"><h4>Ihre Eingaben waren nicht korrekt!</h4>';
        print $formular->elements['salutation']->renderErrorMessage();
        print $formular->elements['name']->renderErrorMessage();
        print $formular->elements['street']->renderErrorMessage();
        print $formular->elements['streetNumber']->renderErrorMessage();
        print $formular->elements['zip']->renderErrorMessage();
        print $formular->elements['town']->renderErrorMessage();
        print '</div>';
      }
    ?>
    <table>
      <?php print $formular->elements['salutation']->renderRow(); ?>
      <tr>
        <td>Ihr Name*</td>
        <td><?php print $formular->elements['name']->renderElement(); ?><br /><span class="textInfo">(Nachname, Vorname)</span></td>
      </tr>
      <tr>
        <td style="white-space:nowrap;padding-right:10px"><?php print $formular->elements['street']->renderLabel(); ?> / <?php print $formular->elements['streetNumber']->renderLabel(); ?></td>
        <td><?php print $formular->elements['street']->renderElement() ;?><?php print $formular->elements['streetNumber']->renderElement() ;?></td>
      </tr>
      <tr>
        <td><?php print $formular->elements['zip']->renderLabel(); ?> / <?php print $formular->elements['town']->renderLabel(); ?></td>
        <td><?php print $formular->elements['zip']->renderElement() ;?><?php print $formular->elements['town']->renderElement() ;?></td>
      </tr>
      <?php print $formular->elements['email']->renderRow(); ?>     
      <?php print $formular->elements['text']->renderRow(); ?>      
      <tr>
        <td></td>
        <td>
          <div style="background-color:#f0f0f0;padding:0 0 8px 0">
            <h4 style="padding:8px">Gewünschte Klassen:</h4>
            <?php print $formular->elements['classes']->renderErrorMessage();?>
            <?php
              foreach($formular->elements['classes']->optionObjects as $optionObject){
                print '<div style="border-top:solid 1px #ffffff;padding:8px">';
                print '<div style="float:left;margin:0 4px 0 0">'.$optionObject->renderElement().'</div>';
                print wDocumentData::getData($optionObject->getValue(), 'title');
                print '</div>'; 
                print '<div style="color:#888888;padding:0 0 10px 29px">';
                print wDocumentData::getData($optionObject->getValue(), 'description')."<br />";
                print '</div>'; 
              }
            ?>
          </div>
        </td>
      </tr>
      <?php print $formular->elements['format']->renderRow(); ?>     
      <?php print $formular->elements['payment']->renderRow(); ?>   
      <?php print $formular->elements['furtherInfo']->renderRow(); ?>    
      <tr>
        <td></td>
        <td><?php print $formular->elements['found']->renderElement(); ?></td>
      </tr>       
      <tr>
        <td> </td>
        <td><?php print $formular->elements['generalTerms']->renderErrorMessage();?><div class="elementText"><?php print $formular->elements['generalTerms']->renderElement(); ?>Die Allgmeinen Geschäftsbedingungen habe ich gelesen und bin damit einverstanden.</div><td>
      </tr>         
      <tr>
        <td><?php print $formular->elements['captchaInput']->renderLabel(); ?></td>
        <td>
          <?php print $formular->elements['captchaInput']->renderErrorMessage();?><?php print $formular->elements['captcha']->renderElement(); ?><?php print $formular->elements['captchaInput']->renderElement(); ?>
          <div class="textInfo" style="clear:left">Bitte tragen Sie den Wert auf dem Bild in das Eingabefeld ein.</div>
        </td>     
      <tr>
        <td colspan="2" style="text-align:right"><?php print $formular->elements['submit']->renderElement(); ?></td>
      </tr>   
    </table>
  </form>
</div>
<?php  
}

?>

Ergebnis

Framework Klassen bestellen

Ihr Name*
(Nachname, Vorname)
/
/

Gewünschte Klassen:

wAI
KI-Klasse
wAnalyzer
Analyse
wApplication
Die aktuelle Installation
wArchiving
Archivierungsfunktionen
wBackup
Klasse für Backups
wBenchmark
Klasse mit Informationen zur Ermittlung des Ressourcenverbrauchs
wBrowseEdit
Erstellt Schaltflächen in der Webseite
wCSS
Zugriff auf CSS-Daten
wCache
Stellt Cache-Funktionen zur Verfügung
wCaptcha
Stellt Funktionen zur Generierung von Bildern aus Text zur Verfügung, um das automatisierte Versenden von Formularen zu verhindern
wCart
Warenkorb
wCategories
Klasse für Kategorien
wCron
Cron-Skripte
wDB
Dabenbank-Objekt
wDOM
DOM zur Verarbeitung von XML-Daten
wDate
Datumsfunktionen
wDiff
Versionsvergleich
wDirectoryData
Klasse ermöglicht den Zugriff auf Verzeichniseinstellungen
wDocument
Dokumenten-Objekt
wDocumentData
Zugriff auf Daten eines Dokumentes
wEnv
Umgebung des aktuellen Skriptaufrufs
wEvent
Ereignis
wFacebook
Klasse für Facebook Funktionen
wForm
Stellt Formular Funktionen zur Verfügung
wGeoData
Ermittelt GEO-Daten
wGroupData
Ermöglicht den Zugriff auf Gruppendaten
wGroups
Ermöglicht den Zugriff auf Gruppen
wImage
Klasse für Bildfunktionen
wLanguages
Klasse für Sprachverwaltung
wLinkchecker
Klasse für Linkprüfung
wList
Stellt Funktionen zur Generierung von Listen zur Verfügung
wMailer
Stellt E-Mail Funktionen zur Verfügung
wMessagecenter
Nachrichtenzentrum
wNavigation
Navigationsgenerator
wNet
HTTP-Anfragen
wNewsletter
Stellt Newsletter Funktionen zur Verfügung
wOutput
Stellt Funktionen zur Generierung von Seiten und zur Manipulation der Ausgabe zur Verfügung.
wPDF
Klasse zur Generierung von PDF-Dokumenten über XSL-FO
wPageAccelerator
Seitenbeschleuniger
wPageCur
Aktuelle Seite
wPageProcessor
Aktuelle Seiten-Transformation
wPathName
Stellt Funktionen für die Verarbeitung von Dateipfaden zur Verfügung
wPicture
Klasse, um responsive Bilder über das PICTURE-Element zu generieren
wProject
Verwaltet Informationen eines Projektes
wProjectCur
Verwaltet Informationen des aktuellen Projektes
wReadWrite
Ermöglicht das Schreiben und Lesen von Dateiinhalten
wRepository
Stellt Zugriffsmöglichkeiten auf Dateien und Verzeichnisse bereit
wRequest
Anfrage-Objekt
wResponse
Stellt Funktionen zu HTTP-Antworten zur Verfügung
wSearch
Die Framework-Klasse wSearch bietet die Schnittstelle zu einer Suche.
wServer
Server
wSession
Session
wSocket
HTTP-Anfrage
wStaticHTML
Klasse macht HTML statisch
wStringconverter
Zeichenkettenmanipulation
wSubscriptions
Abos
wTagcloud
Tag-Wolke / Tag-Cloud
wTexts
Zugriff auf globale Texte
wThumbnail
Erstellt verkleinerte Vorschaubilder
wTwitter
Schnittstelle zu Twitter
wURL
URL Klasse
wUserContent
Von Benutzern generierter Inhalt, wie z.B. Kommentare und Bewertungen
wUserCur
Daten zum aktuellen Benutzer
wUserData
Benutzerdaten
wUsers
Benutzer
wUtils
Utils Klasse, mit allgemeinen nützlichen Funktionen
wValues
Zugriff auf Werte
wVariables
Zugriff auf globale Variablen
wWSL
WSL-Klasse über die wsl-Elemente simuliert werden können.
wWeblic
Klasse für Weblic® Funktionen
wWebstat
Webstatistic
wWorkflow
Workflow-Funktionen
wXSLT
XSLT-Prozessor
wZIP
Entpacken von ZIP-Archiven
 
Die Allgmeinen Geschäftsbedingungen habe ich gelesen und bin damit einverstanden.
Bitte tragen Sie den Wert auf dem Bild in das Eingabefeld ein.
FAQs
Welche Felder sind im umfangreichen Bestellformular erforderlich?
Im Formular sind mehrere Pflichtfelder mit einem * gekennzeichnet, z. B. **Anrede**, **Name**, **Strasse**, **Hausnummer**, **PLZ**, **Stadt** sowie **E-Mail**. Zusätzlich sind **Format** und **Zahlweise** Pflichtfelder. Außerdem wird die Eingabe der **Allgemeinen Geschäftsbedingungen** über ein Checkbox-Feld bestätigt.
Wie wird die E-Mail-Adresse im Formular geprüft?
Die E-Mail wird über einen Validator vom Typ **email** geprüft. Es wird eine gültige E-Mail-Adresse erwartet; bei Fehlern wird die Meldung **"Bitte geben Sie eine gültige E-Mail Adresse an"** angezeigt.
Welche Optionen gibt es bei „Anrede“ und was passiert, wenn sie nicht ausgewählt wird?
Bei **„Anrede“** stehen die Optionen **Herr** und **Frau** zur Verfügung. Das Feld ist erforderlich; bei Nichtauswahl erscheint **"Bitte wählen Sie Ihre Anrede aus."**
Welche Optionen sind beim Feld „PLZ / Stadt“ relevant?
Für **PLZ** und **Stadt** sind Pflichtangaben vorgesehen. **PLZ** wird als Pflichtfeld validiert (Fehlermeldung: **"Bitte geben Sie eine gültige Postleitzahl an"**), **Stadt** ebenfalls (Fehlermeldung: **"Bitte geben Sie eine Stadt an"**).
Was kann bei „Gewünschte Klassen“ ausgewählt werden?
Im Feld **„Gewünschte Klassen“** können per Checkbox **mindestens eine Klasse** ausgewählt werden. Die verfügbaren Optionen werden dynamisch aus Dokumenten geladen (aus einem Klassen-Verzeichnis) und das Feld ist Pflicht (Fehlermeldung: **"Bitte wählen Sie mindestens eine Klasse aus."**).
Welche Formate können bestellt werden?
Beim Feld **„Format“** können mehrere Formate ausgewählt werden (SelectMulti). Die Optionen sind: **gedruckt**, **PDF** und **HTML**. Das Feld ist Pflicht (Fehlermeldung: **"Bitte wählen Sie mindestens Format aus."**).
Welche Zahlungsarten werden im Formular angeboten?
Bei **„Zahlweise“** sind die Optionen **Vorkasse**, **Paypal** und **Rechnung** auswählbar. Das Feld ist erforderlich (Validator mit Fehlermeldung **"Bitte wählen Sie Ihre Anrede aus."**).
Darf ich zukünftigen Kontakt angeben – und welche Optionen gibt es?
Ja, im Abschnitt **„Zukünftiger Kontakt“** können Checkboxen gesetzt werden: **per Mail**, **per Telefon** oder **per Post**. Für dieses Feld ist im Code keine Pflichtvalidierung hinterlegt, d. h. es ist optional.
Muss ich die Allgemeinen Geschäftsbedingungen bestätigen?
Ja. Es gibt ein Checkbox-Feld **„generalTerms“**, das bestätigt werden muss. Es ist mit einem Pflicht-Validator versehen; bei fehlender Bestätigung wird ausgegeben: **"Bitte bestätigen Sie, dass Sie die Allgmeinen Geschäftsbedingungen gelesen haben."**
Wie funktioniert die Sicherheitsabfrage (Captcha) im Formular?
Das Formular nutzt ein Captcha-Feld: Es wird ein zufälliger Wert (z. B. zwischen **1000** und **9999**) angezeigt und anschließend muss der gleiche Wert in das Eingabefeld **„Sicherheitsabfrage“** eingegeben werden. Bei Abweichung erscheint die Fehlermeldung: **"Der eingegebene Wert stimmte nicht mit dem Wert auf dem Bild überein."**
Was passiert beim Absenden des Formulars?
Beim Submit wird der Server-Handler **onSubmit** ausgeführt: Zuerst werden die Formulardaten gesetzt und validiert. Bei **Erfolg** werden zwei E-Mails versendet (an Admin/Empfänger und an den Kunden), der Status wird auf **"sent"** gesetzt und anschließend wird per Redirect zur Seite weitergeleitet. Bei **Fehlern** wird der Status auf **"failed"** gesetzt und ebenfalls per Redirect zur Seite weitergeleitet.
Welche E-Mails werden nach erfolgreicher Bestellung versendet?
1) **E-Mail an den Bestell-Empfänger** (To: **test@cmsedit.de**) mit Betreff **"Neue Bestellung"** und Inhalten wie Anrede, Name, Adresse, E-Mail, Kontaktwünsche, Kommentar, gewünschte Klassen, Formate und Zahlungsart. 2) **E-Mail an den Kunden** (To: Kunden-E-Mail) mit Betreff **"Ihre Bestellung"**, personalisiert mit Anrede und Name sowie Angabe der bestellten Klassen und Formate.
Welche Bestellzusammenfassung wird im Kundenmailtext verwendet?
Im Kundenmail werden u. a. folgende Informationen eingesetzt: **Anrede**, **Name**, **"Sie haben die Dokumentation ... in den Formaten [!--format--] bestellt"** sowie die Liste der **bestellten Klassen** (aus [!--classes--]).
Wird eine Erfolgsmeldung angezeigt, wenn die Bestellung erfolgreich war?
Ja. Wenn der Status nach dem Submit **"sent"** ist, wird die Meldung **"Vielen Dank für Ihre Bestellung!"** angezeigt.
Wie werden Validierungsfehler dem Nutzer angezeigt?
Wenn die Validierung fehlschlägt, wird eine Fehlermeldung ausgegeben („**Ihre Eingaben waren nicht korrekt!**“) und zusätzlich werden die spezifischen Fehlermeldungen der einzelnen Felder (z. B. Anrede, Name, Adresse, PLZ, Stadt, etc.) über **renderErrorMessage()** dargestellt.