Vlastný darovací formulár advanced

Ukážka pokročilej implementácie vlastného darovacieho formulára. Ukážka je doplnená o vysvetlivky pre jednotlivé premenné, polia a hodnoty.

Príklad používa: HTML 5.0 • CSS: Bootstrap 4.5.0 • JS: jQuery 3.5.1 • Validation: Browser native (Constraint validation)

<form>

FORM tag musí obsahovať atribúty:
  1. action="https://api.darujme.sk/v1/donations/post/". Cieľová adresa slúži ako endpoint (spracovateľ požiadavky) a je rovnaká pre všetky organizácie, resp. kampane. Ak sú odoslané údaje v poriadku a sprocesované systémom, zobrazí sa v závislosti od vybranej platobnej metódy buď priamo ďakovná stránka, alebo stránka platobnej brány. Naopak, ak odoslané údaje nie sú v poriadku, zobrazí sa stránka vašej kampane v systéme DARUJME.sk, kde sú označené polia, ktoré chýbajú, prípadne majú zlú alebo nepovolenú hodnotu apod. Napríklad "https://cpftest.darujme.sk/zazite-filantropiu-na-vlastnej-kozi-2497f/".
  2. method="post". Použitie GET metódy nie je akceptované.
  3. enctype="application/x-www-form-urlencoded". Doporučené.
Formulár musí obsahovať:
  1. ID kampane → campaign_id - identifikátor kampane, príklad hodnoty: 2a04b69e-d7dd-4c02-a04c-6f6645349f8b. Ak je identifikátor nevalidný (chybné, alebo neexistujúce ID), používateľ je automaticky presmerovaný na hlavnú stránku projektu DARUJME.sk - https://darujme.sk/
  2. Výšku daru → value - ľubovoľné číslo od 1 do 99999. Je povolené aj desatinné číslo, pričom oddeľovač musí byť "." (bodka), napríklad: "12.50".
Obe premenné sú v tejto ukážke použité ako tzv. "input type hidden".

Periodicita → periodicity
Periodicita je nepovinná premenná, systém ju nevyžaduje, určuje sa automaticky podľa zvolenej platobnej metódy.

Položky pre výber fixnej sumy sa menia dynamicky javascriptom (toggle - show/hide) podľa zvolenej periodicity, pretože jednorázový a pravidelný dar môže mať iný set predvolených hodnôt.

Výška daru / Predvolená suma → fixed_value je vlastná, pomocná premenná. Ak sa vyberie predvolená suma, javascript zabezpečí, aby sa sa premenná value naplnila vybranou hodnotou, napr. "10"

Výška daru / Vlastná suma → custom_value je vlastná, pomocná premenná. Ak sa zadá vlastná suma, javascript zabezpečí, aby sa sa premenná value naplnila zadanou hodnotou, napr. "12.50"

Položky pre výber platobnej metódy sa menia dynamicky javascriptom (toggle - show/hide) podľa zvolenej periodicity, pretože jednorázový a pravidelný dar majú rozdielne dostupné, resp. povolené platobné metódy a zároveň aj ich identifikátory. Identifikátory platobných metód sú rovnaké pre všetky organizácie a kampane. Bankový prevod má rozdielny kód pri jednorázovom a pravidelnom dare.

Spôsob platby → payment_method_id - varianty a kódy platobných metód:

Spôsob platby Hodnota Typ daru
CardPay 1342d2af-a343-4e73-9f5a-7593b9978697 Jednorázový
PayPal c58f76e1-cade-4300-9531-71e275476edd Jednorázový
TatraPay 38409407-c4ec-4060-b4a1-4792f29335ad Jednorázový
SporoPay c07e714c-74ed-4ac6-ab63-3898a73f1fa0 Jednorázový
ePlatby VÚB f2e7956e-a3f6-4bff-9e18-2ab3096a5bed Jednorázový
Bankový prevod 3dcf55d1-6383-45b4-b098-dc588187b854 Jednorázový
ComfortPay b71ff7cf-39f7-40db-8a34-e1f30292c215 Pravidelný
Bankový prevod f425f4af-74ce-4a9b-82d6-783c93b80f17 Pravidelný

Meno → first_name

Priezvisko → last_name

Email → email

Telefón (custom field) → additional_data[fdcee4ce-23c6-4154-ab04-bdc54adc1016]
Systém nevaliduje žiaden zaslaný "custom field", validuje sa len na strane klienta a nezáleží na tom, či je daný "custom field" v administrácii kampane označený ako povinný / nepovinný.

New

Chcem darovať ako právnická osoba → is_company
Po zvolení sa zobrazia ďalšie položky formulára. Táto premenná je nepovinná, systém ju nevyžaduje, slúži len na účely sprehľadnenia tohto príkladu vlastnej darovacej stránky.

kind - Na začiatku formulára je ako input type hidden uvedená premenná "kind". Tou sa rozlišuje fyzická a právnická osoba, možné hodnoty sú "person" (FO), alebo "company" (PO). Ak sa premenná nepošle, systém automaticky vyhodnotí darcu ako fyzickú osobu.

Názov právnickej osoby → company_data[business_name]

Adresa právnickej osoby → company_data[business_address]

IČO právnickej osoby → company_data[business_id]

DIČ právnickej osoby → company_data[tax_id]

IČ DPH právnickej osoby → company_data[vat_id]

Mám záujem o potvrdenie do účtovníctva → company_data[request_confirmation]

Anonymný dar → is_anonymous
Darca zostane anonymný, jeho meno sa nezobrazí v zozname darcov kampane.

Súhlas 01 → terms_consent
Podmienky DARUJME.sk tento súhlas vyžadujú, ale neposiela sa do systému a validuje sa len na strane klienta.

Súhlas 02 → gdpr_consent
Príklad súhlasu, ktorý si môže organizácia pridať, neposiela sa do systému a validuje sa len na strane klienta.

Po úspešnom odoslaní formuláru sa dar spracuje na strane servera, pokračuje sa na platobnú bránu a po úspešnom zaplatení daru systém vráti používateľa na ukážku implementácie vlastnej ďakovnej stránky s prehľadom prijatých GET a POST premenných.

Tip: Ak je vybraná platobná metóda "Bankový prevod" (t.j. vklad na účet), používateľ je hneď presmerovaný na príklad implementácie vlastnej ďakovnej stránky, čo je vhodné pre testovanie.

</form>