Tutorial Formular Generator - von Webbausteine.de - Leichter Einbau in NOF - NetObjects Fusion. Datepicker Skript unten.

Vielen Dank an Werner von Webbausteine.de für diesen tollen Formular-Generator, der keine Wünsche offen lässt.

Dieser Formular-Generator ist eigentlich selbsterklärend. Bitte erstellt Euer Formular hier: Webbausteine.de

Daher hier nur ein Screenshot vom Generator, da sich ein Tutorial erübrigt. Der Einbau ist kinderleicht und wurde von mir bereits in meinem Tutorial zu dem alten Formular-Generator von Webbausteine.de beschrieben, das Ihr hier lesen könnt. Der alte Formular-Generator wurde inzwischen eingestellt.

Formular Generator

 

Datepicker:

Ich habe hier noch einem Feld “Datum” einen Datepicker zur Auswahl des Datums gegeben. Damit das korrekt in allen Browsern funktioniert, fügt Ihr in die HTML des Layout noch dieses Skript ein:

> Layout markieren > Fenster “Layout-Eigenschaften” > Button “HTML” > “Zwischen Head Tags” einfügen

<script src="//cdn.jsdelivr.net/webshim/1.14.5/polyfiller.js"></script>
<script>
    webshims.setOptions('forms-ext', {types: 'date'});
    webshims.polyfill('forms forms-ext');
</script>

Weiterhin habe ich meine Variable ‘$datum’ um eine 2. Variable ’$datumzeige’ für das Datumsfeld erweitert.

Der Grund liegt darin, dass ich zur Umsetzung des HTML5 Datum-Formates JJJJ-MM-TT ein weiteres Skript eingesetzt habe, das dieses Format umsetzt, HTML5 aber das umgesetzte Format zur Anzeige nicht akzeptiert. Daher benötige ich die 2. Variable  ’$datumzeige’ als Wert (value) für das Datumsfeld.

// Variable $datumzeige für Datepicker Eingabefeld
$datumzeige = isset($_POST["datum"]) ? strip_tags(trim($_POST["datum"])) : ""; // Datum

// Variable $datum zum Anzeigen im deutschen Format und zum Versenden in der Mail
$datum = isset($_POST["datum"]) ? strip_tags(trim($_POST["datum"])) : ""; // Datum

if (isset($_POST["datum"])) {
 if (substr_count($datum, '-') > 0) {
  sscanf($datum, "%4s-%2s-%2s", $j, $m, $t);
  $datum = $t . "." . $m . "." . $j;
  echo $datum;
 }
}

Verwendet dann das HTML5 Attribut 'date' für das Eingabefeld vom Datum, sowie die Variable ’$datumzeige’. Beispiel:

<input type='date' name='datum' id='Datum' value='" . $datumzeige . "' size='40'>

Viel Spaß!

Tutorials von Thomas Frei-Herrmann