Formulare mit Drupal
A presentation at DrupalCamp Köln in in Cologne, Germany by Jutta Horstmann
Formulare mit Drupal Drupalcamp, Köln 2009 Jutta Horstmann
whoami Jutta Horstmann (Dipl. Inform., Dipl. Pol.) ITBeraterin (“data in transit”) ● Schwerpunkt: Freie Software ● Content Management Systeme ● DatenbankmanagementSysteme ● Analyse, Beratung, Konzeption ● Implementation, WebProgrammierung : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 2
data in transit ● ITBeratung ● gegründet 2005 in Berlin ● 2006 Umzug nach Bonn ● ● www.dataintransit.com Letzte DrupalProjekte: – select.postbank.de (Postbank AG) – www.lisafreundeskreis.de (Burda) : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 3
Die Themen Wozu Formulare? Ein Beispielprojekt Formulare in Drupal CCK vs. Webforms vs. Programmierung Hot New Stuff : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 4
Wozu Formulare? ©TOM (Jochen Enterprises) : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 5
Ein Beispielprojekt ● ● ● ● Der Kunde ist ein bundesweit operierendes Unternehmen. Auf Stellenangebote des Unternehmens soll man sich online bewerben können. Es gibt 3 Arten von Bewerbungsbögen: Trainee, Berufseinsteiger, Führungsposition. Diese werden pro Ausschreibung vom HRTeam inhaltlich erweitert und angepasst. Es gibt veränderbare und nicht veränderbare Felder. Abgesendete Daten werden per EMail verschickt, in Reports zusammengefasst und exportiert. : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 6
Anforderungen: PUTPUT Anforderungen: INPUT Anforderungen: OUTPUT : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 7
Anforderungen PUTPUT: Das Formular und seine Erstellung : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 8
PUTPUT: Das Formular und seine Erstellung ● ● ● Redakteure erstellen und bearbeiten das Formular Benutzerfreundlicher Formulareditor Anfang und Ende der Veröffentlichung des Formulars terminieren : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 9
Anforderungen INPUT: Strukturierte Dateneingabe : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 10
INPUT: Strukturierte Dateneingabe: Gruppierung von Feldern ● 2 Felder im Formular, 1 Feld in der DB z.B. Vorwahl + Anschluß ● Feldgruppe als “multiple” Feld : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 11
INPUT: Strukturierte Dateneingabe: Abhängigkeiten zwischen Feldern ● ● Wenn Option A gewählt, dann aktiviere Feld X Wenn Feld A ausgefüllt, dann sind Feld B und Feld C Pflichtfelder : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 12
INPUT: Strukturierte Dateneingabe: Mehrseitige Formulare ● Ein Formular wird auf mehrere Seiten verteilt ● Navigation mit “Weiter”, “Zurück” ● Fehlermeldungen auf zugehöriger Seite ● Unabhängig von Javascript : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 13
INPUT: Strukturierte Dateneingabe: Anzeige nach Absenden Wenn Formular vollständig ausgefüllt wurde: ● Bestätigungsnachricht oder ● Weiterleitung auf Bestätigungsseite : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 14
INPUT: Strukturierte Dateneingabe: Weitere Anforderungen ● ● Zwischenspeichern von Eingaben Übernahme von Daten aus anderen bereits gesendeten Formularen als DefaultWert : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 15
Anforderungen OUTPUT: Die Weiterverarbeitung der Daten : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 16
OUTPUT: Die Weiterverarbeitung der Daten Anforderungen: ● Versand per EMail ● Speicherung in der Datenbank ● Datenexport ● ● Übersicht über alle abgesendeten Formulareingaben (zu einem Formular / zu allen vorhandenen Formularen) Reports, Statistiken : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 17
Drupal! : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 18
Formulare in Drupal ● Modul: Webform ● Modul: CCK ● Eigenbau mit Forms API => Einsatz je nach Anforderungen im Projekt (Für die Beispiele: Drupal 6.9, CCK 6.x2.1, Webform 6.x2.4) : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 19
CCK/Webform vs. Programmierung CCK und Webform bieten Formulareditor ● ● ● Keine Programmierkenntnisse notwendig Webform Formulare können von Redakteuren gebaut werden Formulare können sehr schnell gebaut werden : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : CCK 20
CCK/Webform vs. Programmierung ● Eigenbau mit Forms API → Volle Flexibilität function my_module_menu() { $items = array(); $items[‘my_module/form’] = array( ‘title’ => t(‘My form’), ‘page callback’ => ‘my_module_form’, ‘access arguments’ => array(‘access content’), ‘description’ => t(‘My form’), ‘type’ => MENU_CALLBACK, ); return $items; } function my_module_form() { return drupal_get_form(‘my_module_my_form’); } function my_module_my_form($form_state) { $form[‘name’] = array( ‘#type’ => ‘textfield’, ‘#title’ => t(‘Name’), ); $form[‘submit’] = array( ‘#type’ => ‘submit’, ‘#value’ => ‘Submit’, ); return $form; } http://drupal.org/node/262422 : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 21
CCK/Webform vs. Programmierung Best of both worlds: Mit CCK/Webform erstellte Formulare können per FAPI und / oder Themeing noch weiter angepasst werden function helpers_form_alter(&$form, $form_state, $form_id){ if ($form_id == ‘webform_client_form_3’) { $form[‘#validate’][]= ‘helpers_customforms_validate’; } } function helpers_customforms_validate($form, &$form_state) { if ($form_state[‘values’][‘details’][‘page_num’] == 1) { $email = $form_state[‘values’][‘submitted’] [‘kontaktdaten’][‘email’]; if ($email) { if (!eregi(“^[_az09]+(.[_az09]+)@ [az09]+(.[az09]+)(.[az]*)$”, $email)){ form_set_error(‘submitted][kontaktdaten][email’, t(‘%value ist keine valide EMailAdresse.’, array(‘%value’ => $email))); } } } } : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 22
CCK vs. Webform : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 23
Webform vs. CCK Webform ● ● Das Formular ist ein Node Die Eingaben in das Formular sind keine Nodes : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 24
Webform vs. CCK CCK ● ● Das Formular ist ein Inhaltstyp Die Eingaben in das Formular sind Nodes : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 25
Webform vs. CCK Konsequenzen Webform: ● Eingaben in Formulare stehen nicht für Views zur Verfügung CCK: ● Viele Formulare = viele Inhaltstypen : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 26
Webform vs. CCK: Formular erstellen & verwalten (PUTPUT) : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 27
Formular erstellen/verwalten mit Webform ● Inhalt erstellen → Webform → Titel “Trainee Form” oder ● Vorhandenes Formular “Trainee Form” auswählen → Klonen (node_clone) ● Felder anlegen / editieren: Formulareditor ● Veröffentlichung terminieren (scheduler) ● Nicht möglich: Berechtigung pro Feld : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 28
Formular erstellen/verwalten mit CCK ● Verwalten → Inhaltsverwaltung → Inhaltstypen – Inhaltstyp hinzufügen: “form_trainee” oder – “Exportieren” → Inhaltstyp “form_trainee” → Code kopieren → “Importieren” → Code einfügen & editieren → Absenden Umständlich und fehleranfällig. ● Felder anlegen / editieren: Formulareditor ● Nicht möglich: – Veröffentlichung terminieren – Berechtigung pro Feld : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 29
Webform vs. CCK: Strukturierte Dateneingabe (INPUT) : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 30
Strukturierte Dateneingabe mit Webform ● Mehrseitige Formulare (per “pagebreak”) ● Bestätigungsseite nach Absenden konfigurierbar ● Nicht (bzw. nur per Code): – Gruppierung von Feldern – Abhängigkeiten zwischen Feldern – Zwischenspeichern von Eingaben – Übernahme von gespeicherten Daten aus anderen Formularen als Vorgabe für Felder : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 31
Strukturierte Dateneingabe mit CCK ● Zwischenspeichern : “Speichern” ohne “Veröffentlichen” ● Gruppierung von Feldern: flexifield ● Bestätigungsseite nach Absenden: trigger + action ● Mehrseitige Formulare: Eingeschränkt: – pageroute: Inhaltstyp pro Seite. – cck_fieldgroup_tabs: Nur mit aktiviertem Javascript. – multistep: Nur mit aktiviertem Javascript. Nicht Drupal 6. ● Abh. Felder: conditional_fields (nicht: abh. Pflichtfelder) ● Übernahme von Daten als Default: Nur mit Code : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 32
Webform vs. CCK: Weiterverarbeitung der Daten (OUTPUT) : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 33
Weiterverarbeitung der Daten mit Webform ● Versand per EMail – ist eingebaut ● Datenexport: CSV, XLS – ist eingebaut ● Reports, Statistiken – eingebaut (eingeschränkt) ● Speicherung in der DB: webform, webform_component, webform_roles, webform_submissions, webform_submitted_data ● Übersicht über alle abgesendeten Formulareingaben (nur: zu einem Formular, nicht: zu allen vorhandenen Formularen) : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 34
Weiterverarbeitung der Daten mit CCK ● Versand per EMail: trigger + action ● Speicherung in der DB: content_type_form_trainee ● ● ● Export: views_bonus_pack: CSV, DOC, TXT Übersicht über alle abgesendeten Formulareingaben: views Reports, Statistiken: views : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 35
Fazit: Webform vs. CCK ● Flexibilität in INPUT und OUTPUT: → CCK (Ausnahme: mehrseitiges Formular) ● Benutzerfreundlichkeit im Anlegen und Bearbeiten von Formularen (PUTPUT), schnelle ExportLösung: → Webform : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 36
Hot New Stuff & Ausblick : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 37
Front End: Form Builder ● Lullabot ● Formulare bauen per Drag&Drop (AJAX) ● ● Ersatz für alle Drupal Formulareditoren Module fügen Formularlogik hinzu http://drupal.org/project/form_builder http://quicksketch.org/demos/formbuilderexample : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 38
Back End: Drupal 7 Fields API ● ● Felder als 1st level citizens im Core CCK und Webforms können auf die selben Felder zugreifen => zum Beispiel: ● WebformLogik (benutzerfreundliches Anlegen von Formularen, einfacher Export) verheiraten mit ● flexiblen CCKFeldern : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 39
Fragen??? data in transit http://www.dataintransit.com Kontakt jh@dataintransit.com : : : data in transit : : : DrupalCamp 2009 : : : Jutta Horstmann : : : 17.01.2009 : : : 40
In vielen Kundenprojekten spielen Web-Formulare eine zentrale Rolle.
Dabei unterscheiden sich die Anforderungen deutlich. Mal steht die Speicherung von Nutzerdaten für Reporting-Zwecke im Vordergrund, mal komplexe Validierungen der eingegebenen Daten und mal Javascript-gesteuerte Anzeigelogiken, welche die Benutzerführung in umfangreichen Formulare verbessern.
Mein Vortrag stellt die drei wichtigsten Möglichkeiten der Formularerstellung vor: CCK, Webforms und Eigenprogrammierung mit der Drupal Forms API.
Anhand von konkreten Beispielen aus Kundenprojekten wird deutlich, für welchen Zweck welche Herangehensweise am Besten geeignet ist.
Wir werfen auch einen Blick auf aktuelle Entwicklungen im Javascript-Bereich: AHAH-Formularelemente und den Drupal Form Builder von Lullabot.
