Dank der in die Form-Api von Drupal integrierten AHAH - Library ist es für Modulentwickler ohne großen Aufwand möglich, AJAX in Webanwendungen zu integrieren und die Weboberfläche für Benutzer schnell undd dynamisch zu halten. Die Anwendung geht hierbei von einfachen Text-Reloads auf der Seite (AJAX-Validierung von Formularen direkt nach der Eingabe mit onBlur oder onChange) bis hin zu komplexen Ersetzungen von Formularelementen innerhalb eines Formulars. Aufgrund des integrierten Form-Caches in Drupal, der maßgeblich für die Sicherheit und die Performance bei der Arbeit mit Formularen in Drupal (FAPI) verantwortlich ist, kommt es jedoch gerade beim dynamischen Austausch von Formularelementen per AHAH zu Komplikationen. Um anderen Entwicklern das mühsehlige Aufsuchen der verantwortlichen Fehler zu ersparen, hier eine Anleitung, wie man Formulare in Drupal mit zusätzlichen Formularelementen per AHAH-Reload erweitert.
Folgende Dinge sind immer unbedingt zu beachten, da sonst Fehler auftreten:
- Formularelemente müssen mit JSON als HTML an den AHAH Request zurückgegeben werden, nicht als Array (drupal_render mit Array ausführen, siehe Beispielcode weiter unten).
- Es sollte nicht das ganze Formular, sondern nur die inneren Formularelemente nachgeladen werden. Diese Elemente dürfen NICHT mit drupal_get_form geholten werden da sich dann die Build - ID ändert und das Formular nicht mehr mit dem Form-Cache synchron ist (drupal_render mit Array verwenden)
- Der Form-Cache muss auch mit den neuen Elementen synchron gehalten werden.
- Wird der Submitbutton des Formulars mit ausgetauscht, darf sich der Pfad des AHAH-Buttons nicht ändern, da sonst auch die Javascript-Settings-Variable (drupal_add_js) angepasst werden muss. Der Pfad muss also exakt der gleiche bleiben. Soll dennoch der Status des Buttons gespeichert werden, muss das in der Submit-Callback des Buttons in der Variable $_SESSION geschehen.
Grundlegend wird zunächst ein Formular mit der FAPI von Drupal 6 erstellt. Der Submittbutton wird mit der Eigenschaft AHAH definiert. Darin wird der Pfad angegeben, der die neuen Formelemente zurückgibt und ein Wrapper, in den die neuen Elemente eingefügt werden (replace, append oder andere Methoden können hier angegeben werden).
'#ahah' => array(
'path' => 'poll/js',
'wrapper' => 'poll-choices',
'method' => 'replace',
'effect' => 'fade',
(Code des AHAH Buttons aus dem Drupal-Poll-Modul)
Hier ist path der Pfad der Callback. Dieser gibt die neuen Formularelemente als Antwort auf den Drupal AHAH-Request als JSON Objekt zurück. Der Wrapper ist der Container, der als Parent für die neuen Formularelemente verwendet wird.
In der Callback des AHAH-Pfades sollte Folgendes schematisch passieren:
$innerForm = _FUNKTION_FUER_FORMELEMENTE(); //Diese Funktion gibt die neuen Formularelemente als assoziatives Array zurück (kein HTML, gerendert wird später!)
//Formular als nicht abgeschickt zu deklarieren
$form_state = array('submitted' ⇒ false);
//Die build_id aus den POST-Daten lesen
$form_build_id = $_POST['form_build_id'];
//Formular aus dem Cache holen um es anzupassen
$form = form_get_cache($form_build_id, $form_state);
//neue Formelemente innerhalb das Wrappers einfügen (WICHTIG: das Formarray des Cache muss 100% mit der neuen Form identisch sein, evtl. rekursiv Unterschiede mit array_diff rekursiv auffinden), ggf. Arrays auch mit array_merge zusammenfügen.
$form[$type]['wrapper_'.$type]['inner'] = $innerForm; //individuelles Zusammenfügen der Array-Struktur
//Das aktualisierte Formular wieder in den Cache schreiben
form_set_cache($form_build_id, $form, $form_state);
//Mit form_builder das Formular mit notwendigen Elementen ergänzen
$form = form_builder($formID, $form, $form_state);
//neue Elemente rendern
$form = drupal_render($innerForm);
//Und nun das gerenderte Formular als JSON (HTML) als Antwort auf den AHAH-Request zurückgeben.
drupal_json($form);
Ein Beispiel für das Auswechseln von Formularelementen per AHAH-Request in der Drupal-FAPI finden Sie in unserem Projekt "Grußkarten online". Wenn Sie dort im Formular zwischen "eigene Fragen eingeben" und "Fragen automatisch erzeugen" mit den Radiobuttons wechseln, sehen Sie, wie die Elemente per AHAH ausgewechselt werden.
Zeichen für eine falsche Vorgehensweise mit der Drupal FAPI und AHAH - Form-Reloads:
- Nach dem Reload der Formaularelemente mit AHAH-Requests funktionieren die Formularelemente mit AHAH nicht mehr.
- Nach dem zweiten Form-Reload wird bei einem erneuten Klick auf ein AHAH-Element stehts die Seite komplett geladen statt die Formelemente per AHAH zu aktualisieren.
- Beim Abschicken des Formulars treten unerwartet Validierungsfehler auf (dann ist das angezeigt Formular nicht mit dem Formular im Cache synchron.
Sollten Sie unseren Drupal Service in Anspruch nehmen wollen oder sollten Sie Fragen zu diesem Artikel haben, erreichen Sie uns über unser Kontaktformular.
Kommentar hinzufügen