ProcessWire - Formulare: Unterschied zwischen den Versionen

Version vom 17. Oktober 2018, 11:50 Uhr

Links

https://processwire.com/talk/topic/2089-create-simple-forms-using-api/ von Soma
https://processwire.com/talk/topic/14206-contact-form-tutorial/ Mit Google ReCaptcha

Allgemeines

Das Markup eines Formulars kann man entweder manuell erstellen oder mit einem Formobjekt, das über eine render() Funktion ausgegeben wird.

Zur Auswertung und Validierung stellt PW ebenfalls einige Objekte und Funktionen zur Verfügung.

Für das Styling kann man eigene Stile nutzen. Als Inspiration für das Styling kann man inputfields.css aus dem templates-admin Ordner nutzen. Auch das CSS aus wire/modules/InputfieldRadios kann hilfreich sein.

Wichtige Funktionen

$form->processInput($input->post) // prevent CSRF, append a hidden field
$form->getErrors();
$form->render();
$form->setMarkup();

Hooks

Über Hooks lassen sich eigene Validierungen und vieles mehr realisieren.

Formular-Objekt und Felder definieren

// create a new form field (also field wrapper)
$form = $modules->get("InputfieldForm");
$form->action = "./";
$form->method = "post";
$form->attr("id+name",'subscribe-form');

// create a text input
$field = $modules->get("InputfieldText");
$field->label = "Name";
$field->attr('id+name','name');
$field->required = 1;
$form->append($field); // append the field to the form

// oh a submit button!
$submit = $modules->get("InputfieldSubmit");
$submit->attr("value","Subscribe");
$submit->attr("id+name","submit");
$form->append($submit);

Formular rendering konfigurieren

Mit der Funktion setMarkup(array()) kann man die Ausgabe von $form->render() konfigurieren.

$form->setMarkup(array(
   'list' => "<div {attrs}>{out}</div>",
   'item' => "<div {attrs}>{out}</div>"
));

Formulardaten auswerten

// form was submitted so we process the form
if($input->post->submit) {

    // user submitted the form, process it and check for errors
    $form->processInput($input->post);

    // here is a good point for extra/custom validation and manipulate fields
    $email = $form->get("email");

    if($email && (strpos($email->value,'@hotmail') !== FALSE)){        // attach an error to the field
        // and it will get displayed along the field
        $email->error("Sorry we don't accept hotmail addresses for now.");

    }

    if($form->getErrors()) {
        // the form is processed and populated
        // but contains errors
        $out .= $form->render();
    } else {

        // 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);

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

    }
} else {
    // render out form without processing
    $out .= $form->render();
}

Get und Post Daten holen und für Suchselektoren nutzen

// if there are KEYWORDS, look in the title and body fields for the words
if($input->get->keywords) {
	$value = $sanitizer->selectorValue($input->get->keywords); // Sanizize user input
	$selector .= "title|body|summary%=$value, "; // %= search parts // create a selector for later
	$input->whitelist('keywords', $value); // 
}

Beispiele

Suchformular

Get Variablen auswerten (Genbänkle)

// SEARCH
// most of the code in this template file is here to build this selector string
// it will contain the search query that gets sent to $sortList
$selector = '';

// we use this to store the info that generates the summary of what was searched for
// the summary will appear above the search results
$summary = array(
	"keywords" => "",
	"sort_id" => "",
	"sort_red_list" => "",
  "sort_wild_plant" => "",
  "sort_rare" => "",
  "sort_winter_plant" => "",
  "sort_useful_ornamental" => "",
  "sort_bw_typical" => "",
	);

//var_dump($input->get->keywords);

// if there are KEYWORDS, look in the title and body fields for the words
if($input->get->keywords) {
	$value = $sanitizer->selectorValue($input->get->keywords);
	$selector .= "title|body|summary%=$value, ";
	$summary["Stichwort"] = $sanitizer->entities($value);
	$input->whitelist('keywords', $value);
}

// SORTS_ID
if($input->get->sort_id) {
	$value = $sanitizer->selectorValue($input->get->sort_id);
	$selector .= "pr_types=$value, ";
  $p = $pages->get($sanitizer->entities($value));
	$summary["Art"] = $p->title;
	$input->whitelist('sort_id', $value);
}


// PROPERTIES
// Checkbox names
$properties = array(
 'sort_red_list',
 'sort_bw_typical',
 'sort_rare',
 'sort_wild_plant',
 'sort_winter_plant',
 'sort_useful_ornamental'
);

foreach ($properties as $k){
  $label = $pages->fields->get($k)->label;
  if($input->get->{$k}) {
  	$value = $sanitizer->selectorValue($input->get->{$k});
    $selector .= "$k=1, ";
  	$summary["$label"] = $sanitizer->entities($value);
  	$input->whitelist($k, $value);
  }
}
// RED LIST
/*
if($input->get->sort_red_list) {
	$value = $sanitizer->selectorValue($input->get->sort_red_list);
	//$selector .= "sort_properties=1, "; // 1 = red_list
  $selector .= "sort_red_list=1, ";
	$summary["Rote Liste"] = $sanitizer->entities($value);
	$input->whitelist('sort_red_list', $value);
}
*/


// SEARCH SUMMARY
$content = '<h5>Ihre Suche</h5><ul id="search_summary" class="uk-list">';
$browserTitle = "Sorten - ";

foreach($summary as $key => $value) {
	if(!$value) continue;
	$key = ucfirst($key);
	$content .= "\n\t<li><strong>$key:</strong> $value</li>";
	$browserTitle .= "$key: $value, ";
}
$content .= "\n</ul>";

// FINAL OUTPUT
$content .= renderSortList(findSorts($selector)); 
$browserTitle = rtrim($browserTitle, ", ");

$content = $layoutBlocks.$content;
?>
<div id="content" class="sort-search uk-width-expand">
	<?=$content?>
</div>

<aside id='sidebar' class='uk-width-1-3@m'>
	<div class='uk-card uk-card-muted uk-card-hover uk-card-body uk-margin-medium-top'>
		<?php include("./includes/search_form_big.php"); ?>
	</div>
	<div class="uk-margin">
		<?=$page->sidebar?>
	</div>

</aside>

Soma Beispiel

<?php
$out = '';

// create a new form field (also field wrapper)
$form = $modules->get("InputfieldForm");
$form->action = "./";
$form->method = "post";
$form->attr("id+name",'subscribe-form');

// create a text input
$field = $modules->get("InputfieldText");
$field->label = "Name";
$field->attr('id+name','name');
$field->required = 1;
$form->append($field); // append the field to the form

// create email field
$field = $modules->get("InputfieldEmail");
$field->label = "E-Mail";
$field->attr('id+name','email');
$field->required = 1;
$form->append($field); // append the field

// you get the idea
$field = $modules->get("InputfieldPassword");
$field->label = "Passwort";
$field->attr("id+name","pass");
$field->required = 1;
$form->append($field);

// oh a submit button!
$submit = $modules->get("InputfieldSubmit");
$submit->attr("value","Subscribe");
$submit->attr("id+name","submit");
$form->append($submit);

// form was submitted so we process the form
if($input->post->submit) {

    // user submitted the form, process it and check for errors
    $form->processInput($input->post);

    // here is a good point for extra/custom validation and manipulate fields
    $email = $form->get("email");

    if($email && (strpos($email->value,'@hotmail') !== FALSE)){        // attach an error to the field
        // and it will get displayed along the field
        $email->error("Sorry we don't accept hotmail addresses for now.");

    }

    if($form->getErrors()) {
        // the form is processed and populated
        // but contains errors
        $out .= $form->render();
    } else {

        // 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);

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

    }
} else {
    // render out form without processing
    $out .= $form->render();
}

include("./head.inc");
echo $out;
include("./foot.inc");

Einfaches Formular (ohne Spamschutz)

<?php namespace ProcessWire;

function renderContactForm($backend_email, $subject) {
  $out = '';

  $modules = wire('modules'); // get access to pw modules object
  $input = wire('input');
  $sanitizer = wire('sanitizer');

  // Create the new <form>
  $form = $modules->get("InputfieldForm"); // get InputfieldForm Object
  $form->action = "./";
  $form->method = "post";
  $form->attr("id+name",'contact-form');

	// Set markup for form elements
  $form->setMarkup(array(
    'list' => "<div {attrs}>{out}</div>",
    'item' => "<div {attrs}>{out}</div>",
    //'item_label' => "<label for='{for}'>{out}</label>",
    'item_label' => "", // no label markup for this form
    'item_content' => "{out}",
    'item_error' => "<p class=\"error\">{out}</p>",
    'item_description' => "<p>{out}</p>",
    'item_head' => "<h2>{out}</h2>",
    'item_notes' => "<p class='notes'>{out}</p>",
  ));

	// Set classes for form elements
  $form->setClasses(array(
    'list' => 'form-list',
    'list_clearfix' => '',
    'item' => '{class}',
    'item_required' => 'required',
    'item_error' => '',
    'item_collapsed' => '',
    'item_column_width' => '',
    'item_column_width_first' => ''
  ));

	// New field: First name
  $field = $modules->get("InputfieldText");
  $field->label = __("Name");
  $field->attr([
    'id+name' => 'name',
    'placeholder' => 'Ihr Name',
    'class' => 'text'
    ]);
  $field->required = 1;
  $form->append($field);

	// New field: E-Mail
  $field = $modules->get("InputfieldEmail");
  $field->label = __("E-mail");
  $field->attr([
    'id+name' => 'email',
    'placeholder' => 'Ihre E-Mail Adresse',
    'class' => 'text'
    ]);
  $field->required = 1;
  $form->append($field);

	// New field: Phone
  $field = $modules->get("InputfieldText");
  $field->label = __("Telefon");
  $field->attr([
    'id+name' => 'phone',
    'placeholder' => 'Ihre Telefonnummer',
    'class' => 'text'
    ]);
  $field->required = 1;
  $form->append($field);

	// New field: Message
  $field = $modules->get("InputfieldTextarea");
  $field->label = __("Nachricht");
  $field->attr([
    'id+name' => 'message',
    'placeholder' => 'Ihre Nachricht',
    'class' => 'textarea'
    ]);
  $field->required = 1;
  $form->append($field);


  // SUBMIT button!
  $submit = $modules->get("InputfieldSubmit");
  $submit->attr("id+name", "submit");
  $submit->attr("class", "submit");
  $form->append($submit);

  // POST request, process the form
  if($input->post->submit) {
      $form->processInput($input->post);

      $name = $sanitizer->text($input->post->firstname);
      $email = $sanitizer->email($input->post->email);
      $message = $sanitizer->text($input->post->message);
      $phone = $sanitizer->text($input->post->phone);

      // ERRORS...
      if($form->getErrors()) {
        $out .= $form->render();
      } else {
        // FORM OK...
      	// Process the form here!

        $mail = wireMail();
        $mail->to($backend_email)->from($email);
        $mail->subject($subject);


        $body = "Name: " . $firstname . "\n";
        $body .= "E-Mail: " . $email . "\n";
        $body .= "Telefon: " . $phone . "\n\n";
        $body .= "Nachricht:\n" . $message;

        $mail->body($body);

        echo '<pre>'.$body.'</pre>';
        $numSent = $mail->send();

        $out .= '<p>'.__("Vielen Dank für Ihre Nachricht! Wir melden uns so bald wie möglich.").'</p>';

      }
  } else {
      // GET request, simply show the form
      $out .= $form->render();
  }

  return $out;
}

ProcessWire - Formulare: Unterschied zwischen den Versionen

Version vom 17. Oktober 2018, 11:50 Uhr

Inhaltsverzeichnis

Links

Allgemeines

Wichtige Funktionen

Hooks

Formular-Objekt und Felder definieren

Formular rendering konfigurieren

Formulardaten auswerten

Get und Post Daten holen und für Suchselektoren nutzen

Beispiele

Suchformular

Get Variablen auswerten (Genbänkle)

Soma Beispiel

Einfaches Formular (ohne Spamschutz)

Navigationsmenü

Ansichten

Meine Werkzeuge

Navigation

Suche

Werkzeuge