Głębokie zanurzenie się w module Webform dla Drupala 8/9

Opublikowany: 2021-10-12

Moduł Webform to najpotężniejszy i najbardziej elastyczny kreator formularzy i menedżer zgłoszeń dla Drupala. Daje konstruktorom witryn możliwość łatwego i natychmiastowego tworzenia złożonych formularzy. Jest wyposażony w pewien poziom ustawień domyślnych, co pozwala również dostosować go zgodnie z własnymi wymaganiami.

Zajrzyj na ten niesamowity blog – Drupal 8 Webform Module – Krótki samouczek, który pomoże Ci rozpocząć pracę z modułem Webform w witrynie Drupal 8/9. Pomoże ci to łatwo zrozumieć podstawy.

Moduł Webform jest dostarczany z wieloma interesującymi funkcjami i chciałbym wspomnieć o kilku tutaj.

Moduł formularza internetowego

Funkcje formularza internetowego

1. Zmiana formy i elementów

Dowolną formę, element i związane z nim ustawienia można zmienić za pomocą odpowiednich zaczepów. Poniżej znajduje się kilka dostępnych haków, a więcej można znaleźć w pliku webform.api.php :

  • Haki do form

◦ hook_webform_submission_form_alter()
◦ Wprowadź zmiany przed wyrenderowaniem formularza przesyłania formularza internetowego.

  • Haki do elementów

◦ hook_webform_element_alter()
◦ Zmień elementy formularza internetowego.

  • Opcjonalne haki

◦ hook_webform_options_alter()
◦ Zmień opcje formularza internetowego.

  • Haki uchwytowe

◦ hook_webform_handler_invoke_alter()
◦ Działaj na module obsługi formularza internetowego, gdy wywoływana jest metoda.

  • więcej haczyków…

◦ hook_webform_access_rules_alter() itp.
◦ Zmień listę reguł dostępu, którymi należy zarządzać na poziomie formularza internetowego.

2. Źródło YAML

Moduł Webform rozpoczął się jako moduł YAML Form, który umożliwiał ludziom tworzenie formularzy poprzez pisanie znaczników YAML. W pewnym momencie moduł YAML Form zaczął mieć interfejs użytkownika i stał się modułem Webform dla Drupala 8.

  • YAML zapewnia prosty i łatwy do nauczenia język znaczników do tworzenia i zbiorczej edycji elementów formularza internetowego.
  • Strona Źródło (widok) umożliwia programistom edytowanie tablicy renderowania formularza internetowego przy użyciu znaczników YAML. Deweloperzy mogą używać strony źródłowej (Widok) do ręcznego kodowania formularzy internetowych, aby szybko zmieniać etykiety formularzy internetowych, wycinać i wklejać wiele elementów, zmieniać kolejność elementów, a także dodawać niestandardowe właściwości i znaczniki do elementów.
  • Oto przykład formularza kontaktowego i odpowiadającego mu kodu źródłowego YAML:

Formularz kontaktowy z interfejsem „przeciągnij i upuść”

Formularz kontaktowy z interfejsem „przeciągnij i upuść”

Kod źródłowy YAML

Kod źródłowy YAML formularza kontaktowego

3. Pola warunkowe

Webform umożliwia dodanie logiki warunkowej do elementów w formularzu. Rozważmy mały przykład, w którym musimy warunkowo obsługiwać widoczność elementów na podstawie wartości innego elementu w formularzu.

Oto przykładowy formularz z polami dwuetapowymi, KROK 1 (element Radia) z opcjami „E-mail” i „Numer telefonu komórkowego”. KROK 2 (Fieldset) z dwoma elementami: „E-mail” i „Numer telefonu komórkowego”.

Strona kompilacji

Strona tworzenia formularza

Strona widoku formularza

Strona Widok formularza

W powyższym przykładzie chciałbym wyświetlić pole „E-mail”, jeśli w kroku 1 wybrano opcję „E-mail”, w przeciwnym razie wyświetlić pole „Numer telefonu komórkowego”, jeśli w kroku 1 wybrano opcję „Numer telefonu komórkowego”.

Aby to osiągnąć, edytuj pole „E-mail”, kliknij kartę „Warunki”, wybierz „Stan” jako „Widoczny” i ustaw „Wyzwalacz/Wartość” jako „KROK 1 [Radios] wartość to e-mail”. Podobnie, wykonaj te same kroki, aby dodać logikę warunkową do pola „Numer telefonu komórkowego” i ustaw „Wyzwalacz/wartość” jako „KROK 1 [Radios] Wartość to numer_mobilny”. Oto ostateczny wygląd formularza internetowego:

Edytuj element wiadomości e-mail

Konfigurowanie logiki warunkowej

Krok 1

Formularz po wybraniu „E-mail” w KROKU 1

Krok 2

Formularz po wybraniu „Numeru telefonu komórkowego” w KROKU 1

4. Właściwości opcji niestandardowych

Webform umożliwia dodawanie niestandardowych właściwości opcji do elementów from.

Wyobraź sobie scenariusz, w którym chciałbyś warunkowo obsługiwać opcje elementu radiowego na podstawie wartości innego elementu w formularzu. Jak byś to zrobił?

Cóż, nie znalazłem sposobu, aby sobie z tym poradzić poprzez ustawienia logiki warunkowej z interfejsu użytkownika. Ale istnieje przepis, aby ustawić "właściwości opcji niestandardowych" dla twojego elementu, w którym piszesz wymaganą logikę warunkową skierowaną do twoich opcji w elemencie za pomocą kodu YAML.

Oto przykład, gdzie widzimy dwa elementy radiowe i na podstawie opcji, którą wybiorę w pierwszym elemencie, widoczność opcji w ramach drugiego elementu powinna się zmienić.

Strona tworzenia formularza

Strona tworzenia formularza

Opcja niestandardowa

Strona Widok formularza przed dodaniem jakichkolwiek niestandardowych właściwości opcji:

  • Jeśli wybrano „Typ A”, to „Opcja 1” i „Opcja 2” powinny być widoczne z drugiego elementu. Podobnie, jeśli wybrano „Typ B”, wówczas „Opcja 3” i „Opcja 4” powinny być widoczne. Aby to osiągnąć, edytuj drugi element, przejdź do zakładki „Zaawansowane”, przewiń w dół do sekcji „Opcje (niestandardowe) właściwości” i napisz niezbędną logikę w YAML.
Element opcjiEdytuj element opcji

Konfigurowanie właściwości opcji

Wybierz typ

Formularz po wybraniu „Typu A”

Wybierz typ B

Formularz po wybraniu „Typu B”

5. Moduły obsługi e-maili do przesyłania formularzy internetowych

  • Obsługa poczty e-mail

Programy obsługi poczty e-mail wysyłają formularz internetowy za pośrednictwem poczty e-mail. Aby dodać moduły obsługi poczty e-mail do formularza internetowego, przejdź do zakładki „Ustawienia”, a następnie „E-maile/programy obsługi”. Następnie kliknij przycisk „Dodaj adres e-mail / Dodaj obsługę”.

Obsługa poczty e-mail

Dodaj obsługę poczty e-mail

  • Jak pokazano na poniższym obrazku, na karcie „Ogólne” dodaj „Tytuł” ​​i ustaw szczegóły „Wyślij do” i „Wyślij z”. Dodaj komunikat „Temat” i „Treść” zgodnie z wymaganiami i zapisz formularz konfiguracyjny.
Potwierdzenie e-mailObsługa potwierdzeńProgram obsługi potwierdzenia adresu e-mailWiadomośćOpis tytułu

I to wszystko. Twój opiekun zostaje zwolniony po każdym przesłaniu formularza.

  • Możesz również ustawić warunkowe procedury obsługi wiadomości e-mail w formularzu internetowym, tj. uruchamiać różne procedury obsługi wiadomości e-mail na podstawie wartości niektórych elementów w formularzu.
  • Rozważmy na przykład element „Wybierz” o wartościach „Typ 1” i „Typ 2”. Jeśli użytkownik wprowadzi „Typ 1”, uruchom procedurę obsługi „E-mail — typ 1”, która ustawił adres „Do” na „ [email protected] ”. Jeśli użytkownik wprowadzi „Typ 2”, uruchom procedurę obsługi „E-mail — typ 2”, która ustawił adres „Do” na „ [email protected] ”.
  • Aby dodać logikę warunkową do programu obsługi poczty e-mail, utwórz jeden program obsługi i nazwij go „E-mail — typ 1”. Ustaw adres „Do” na „ [email protected] ”, przejdź do zakładki „Warunki”, wybierz „Stan” jako „Widoczny” i ustaw „Wyzwalacz/Wartość” jako „Wybierz typ [Wybierz] wartość to type_1”.
  • Podobnie utwórz drugi program obsługi i nazwij go „E-mail — typ 2”. Ustaw adres „Do” na „ [email protected] ”, przejdź do zakładki „Warunki”, wybierz „Stan” jako „Widoczny” i ustaw „Wyzwalacz/Wartość” jako „Wybierz typ [Wybierz] wartość to type_2”.
Typ e-maila

  • Zaplanowane programy obsługi poczty e-mail

    • Rozszerza obsługę poczty e-mail modułu Webform o możliwość planowania wiadomości e-mail. Aby skorzystać z tej funkcji, włącz moduł podrzędny „Zaplanowana obsługa poczty e-mail w formularzu internetowym”.
    • Aby zaplanować wysyłanie wiadomości e-mail z przesłanymi formularzami, kliknij przycisk „Dodaj obsługę”. Wybierz moduł obsługi „Zaplanowana poczta e-mail”.
Wybierz obsługę

Istnieje tylko jedno dodatkowe ustawienie konfiguracji w module obsługi „Zaplanowana poczta e-mail” w porównaniu z normalną „obsługą poczty e-mail”. I to jest, aby dodać Zaplanuj datę e-mail w zakładce Ustawienia ogólne.

Zaplanuj obsługę poczty e-mail

Zaplanowana obsługa poczty e-mail

Ustaw datę uruchomienia programu obsługi, a po uruchomieniu następnego crona Twój e-mail zostanie wysłany!

Znajdowanie pomocy

Pomoc z modułem formularza internetowego można uzyskać na różne sposoby. Oto lista kilku źródeł:

  • Dokumentacja, książka kucharska i screencasty
    • https://www.drupal.org/docs/8/modules/webform
  • Kolejka problemów z formularzem internetowym
    • https://www.drupal.org/project/issues/webform
  • Odpowiedzi Drupala
    • http://drupal.stackexchange.com
  • Slack kanał
    • Zapytania dotyczące modułu Webform zawsze możesz zamieścić na kanale #webform w obszarze roboczym Drupal slack. Każdy ze społeczności, nawet opiekun modułu, jest zawsze w pobliżu i jest na tyle uprzejmy, aby pomóc ci rozwiązać twoje problemy.

OGROMNE okrzyki dla Jacoba Rockowitza za jego nieugięte wsparcie dla modułu Drupal 8/9 Webform. Bez niego Webform nie byłby tym, czym jest teraz.