ProcessWire - Formulare mit der API erstellen (Tutorial)

Stichworte

TODO - Artikel fertigstellen...

CSRF

Links

https://processwire.com/talk/topic/2089-create-simple-forms-using-api/

Allgemeines Vorgehen

Zwei Schritte

Formulare benötigen i.d.R. 2 Arbeitsschritte. Die Darstellung des Formulars und das Validieren der Formulareingaben (Processing).

Anschließend können wir die Daten individuell weiter Verarbeiten. Dies wäre genau genommen ein dritter Schritt, denn ohne eine weitere Verarbeitung würde man ja auch kein Formular benötigen.

Zur Verarbeitung gehören wiederum mehrere Teilaufgaben.

• Formularausgabe
• Formular verarbeiten
  • Validierung der Formulardaten (Felder vom User richtig ausgefüllt)
  • Formulardaten gegen Angriffe bereinigen (Sanitizer / Whitelist)
  • Fehleingaben mit Fehlermeldungen quittieren
  • Bei Fehlern in der Eingabe Formular vorausfüllen.
  • Formulardaten zur Verarbeitung weitergeben

Für alle Aufgaben stellt uns ProcessWire Funktionen zur Verfügung. Außerdem gibt ein paar Zusatzhelfer wie de Sanitizer und die Whitelist und Schutzmechanismen gegen Crosssite Attacken. Diese kann man einzeln nutzen sind zum Teil aber schon automatisch intergriert, wenn du wie unten vorgehst.

Zusätzlich kannst du selbst Daten Validieren oder auch das Aussehen des Formulars beeinflussen.

Basis Code

$form = createForm();
$out = processForm();

/**
 * This way we create a form
 */
function createForm(){
  // create form
  $form = wire()->modules->get("InputfieldForm");
  // ...
  // create some fields and a submit button and add them

  // return form object
return $form;
}

/**
 * Check if user submitted data and do validation stuff.
 */
function processForm($form){
  $out = '';
  if($input->post->submit) { // note that submit is name of submit button
    
    $form->processInput($input->post); // some pw magic like automatic validation based on fields configuration and type
    
    // maybe we want to add some extra validation
    $email = $form->get("email");
    if($email && (strpos($email->value,'@hotmail') !== FALSE)){ 
      $email->error("Sorry we don't accept hotmail addresses for now."); // manually attach an error 
    }

    if($form->getErrors()) {
      // if we got errors we want to show the form again, including error messages
        $out .= $form->render();
    } else {
      // form data is ok - now we can process the data
      $out .= processFormData($form);
    }
  }else{
    // no data submitted - simply render a fresh form
    $out .= $form->render();
  }
}

/**
 * Once we have successfull submission we can do further processing
 */
function processFormData($form){
  $out = '';
  // do with the form what you like, create and save it as page
  // or send emails. to get the values you can use
  // $email = $form->get("email")->value;
  // $name = $form->get("name")->value;
  // $pass = $form->get("pass")->value;
  
  // to sanitize input
  // $name = $sanitizer->text($input->post->name);
  // $email = $sanitizer->email($form->get("email")->value);

  $successMarkup .= "<p>Thanks! Your submission was successful.";
  return $out;
    
}

Formular erstellen im Detail

Todo

Manipulate Form rendering

Todo

Manipulate Error rendering

Todo

CSRF

Todo - show how pw does this

Sanitizer and Whitelist

https://processwire.com/api/ref/sanitizer/

Todo - Maybe refer to other chapters