Parametrii formatului Modx revo. Formular de feedback pe MODX Revo folosind Formit cu un captcha neobișnuit. Ce este FormIt
FormIt 3.0 introduce o actualizare a metodelor de criptare utilizate pentru criptarea trimiterilor de formulare. Înainte de 3.0 a fost folosit mcrypt, care în 3.0 este înlocuit cu openssl, deoarece mcrypt a fost depreciat începând cu PHP 7.2. FormIt 3.0 vine cu o pagină de migrare care este accesibilă de la manager.
Începând cu FormIt 2.2.9, toate câmpurile vor avea automat aplicate html_entities. Pentru a permite salvarea/stocarea etichetelor HTML, va trebui să utilizați validatorul allowSpecialChars pe fiecare câmp, care ar trebui să salveze etichete HTML brute.
Începând cu FormIt 1.1.4, toate câmpurile vor avea automat aplicate stripTags. Pentru a permite salvarea/stocarea etichetelor HTML, va trebui să utilizați validatorul allowTags pe fiecare câmp, care stipulează ce etichete sunt permise.
Cum se utilizează
Pur și simplu plasați apelul pentru fragmentul FormIt în Resursa care conține formularul pe care doriți să îl utilizați. Spre deosebire de predecesori similari (în special eForm în MODX Evolution), nu puneți formularul într-un Chunk și nu faceți referire la Chunk în apelul de fragment FormIt: puneți literalmente apelul de fragment de-a lungul laturii formularului pe care doriți să îl proceseze. Specificați „cârligele” (sau scripturile de procesare post-validare) în apelul fragmentului. Apoi adăugați validarea prin intermediul &validași &CustomValidators parametrii din eticheta snippet.
Dacă aveți mai multe formulare pe o pagină, setați &submitVar proprietatea din apelul Snippet la un nume al unui element de formular din formular (adică, &submitVar=`form1-submit`). Acest lucru îi spune FormIt să proceseze numai cererile de formular cu acea variabilă POST. Ar trebui folosite mai multe formulare cu INPUT type="submit" name="form1-submit", elementele butoanelor au fost raportate că nu funcționează.
Proprietăți disponibile
Acestea sunt proprietățile generale disponibile pentru apelul FormIt (fără a include proprietățile specifice cârligului):
Nume | Descriere | Valoare implicită |
---|---|---|
precârlige | Ce scripturi să declanșeze, dacă există, odată ce formularul se încarcă. Aceasta poate fi o listă de cârlige separate prin virgulă, iar dacă prima eșuează, cele care urmează nu se vor declanșa. Un cârlig poate fi, de asemenea, un nume de fragment care va executa acel fragment. | |
renderHooks | Ce scripturi să declanșeze, dacă există, odată ce formularul se încarcă, preHook-urile sunt terminate și toate câmpurile și erorile au fost setate. Aceasta poate fi o listă separată prin virgulă de utilizat pentru manipularea tuturor câmpurilor din formular înainte ca totul să fie setat pe baza datelor date din alte pachete sau preHooks. Un cârlig poate fi, de asemenea, un nume de fragment care va executa acel fragment. | |
cârlige | Ce scripturi să declanșeze, dacă există, după ce formularul trece validarea. Aceasta poate fi o listă separată prin virgulă, iar dacă prima eșuează, cele care urmează nu se vor declanșa. Un cârlig poate fi, de asemenea, un nume de fragment care va executa acel fragment. | |
submitVar | Dacă este setată, nu va începe procesarea formularului dacă această variabilă POST nu este trecută. Observație: Este necesar dacă utilizați proprietatea &store (+ setați submit var în input="submit"!). | |
valida | O listă de câmpuri separate prin virgulă de validat, cu numele fiecărui câmp ca nume:validator (de exemplu: nume de utilizator:obligatoriu, e-mail:obligatoriu). Validatorii pot fi, de asemenea, înlănțuiți, cum ar fi email:email:required . Această proprietate poate fi specificată pe mai multe linii. | |
validationErrorMessage | Un mesaj de eroare general de setat la un substituent [[!+fi.validation_error_message]] dacă validarea eșuează. Poate conține [[+erori]] dacă doriți să afișați o listă cu toate erorile în partea de sus. | A apărut o eroare de validare a formularului. Vă rugăm să verificați valorile pe care le-ați introdus. |
validationErrorBulkTpl | HTML tpl care este utilizat pentru fiecare eroare individuală din valoarea mesajului de eroare de validare generică. | [[+eroare]] |
errTpl | Wrapper-ul html pentru mesajele de eroare. Notă: nu o bucată, doar HTML direct. | [[+eroare]] |
customValidators | O listă separată prin virgulă de nume de validator personalizat (fragmente) pe care intenționați să le utilizați în acest formular. Acestea trebuie specificate în mod explicit aici, altfel nu vor fi executate. | |
clearFieldsOnSuccess | Dacă este adevărat, va șterge câmpurile dintr-un formular trimis cu succes, care nu redirecționează. | 1 |
magazin | Dacă este adevărat, va stoca datele în cache pentru extragere folosind fragmentul FormItRetriever. | 0 |
storeTime | Dacă „stocare” este setat la adevărat, aceasta specifică numărul de secunde pentru stocarea datelor de la trimiterea formularului. Implicit la cinci minute. | 300 |
locatia magazinului | Când utilizați magazin, aceasta definește locul în care este stocat formularul după trimitere. Opțiunile posibile sunt „cache” și „session”. Setarea implicită este „cache”. | cache |
substituentPrefix | Prefixul de utilizat pentru toți substituenții setați de FormIt pentru câmpuri. Asigurați-vă că includeți „.” separator în prefixul dvs. | fi. |
succesMessage | Dacă nu utilizați cârligul de redirecționare, afișați acest mesaj de succes după o trimitere cu succes. | |
successMessagePlaceholder | Numele substituentului la care să setați mesajul de succes. | fi.successMessage |
redirectTo | ID de pagină al unei pagini „Mulțumesc”, unde vizitatorul poate fi trimis după trimiterea cu succes a formularului, dar acest parametru este citit NUMAI dacă includeți „redirecționare” în lista de &hooks. | |
allowFiles | Specificați dacă fișierele pot fi postate. Fișierele trimise sunt stocate într-un director temporar pentru a preveni pierderea fișierelor în forme cu mai mulți pași. | Adevărat |
atașați fișiere la e-mail | Atașează fișierele încărcate în e-mail, formularul trebuie setat ca enctype="multipart/form-data" | Adevărat |
Validare
Validarea în FormSe face prin proprietatea &validate și poate fi folosită pentru a gestiona automat validarea pe oricare dintre câmpurile din formular.
Pentru mai multe informații despre validarea în FormIt, consultați
Mai avem o singură pagină pe care nu am refăcut-o încă. Aceasta este pagina Contacte. Aici avem pe lângă informații de contact formularul va fi localizat părere. În MODx există un fragment special pentru crearea unui astfel de formular - eForm. Să vedem mai întâi în ce poate consta un formular de feedback.
1. În primul rând, acesta este formularul în sine cu câmpuri de intrare Nume, adresa postala, Subiecte de mesajeși el însuși Mesaje. Pentru a vă proteja împotriva spam-ului, ar trebui să adăugați un captcha - un formular pentru introducerea codului din imaginea generată. De asemenea, este necesar să se permită verificarea corectitudinii informațiilor introduse.
2. Notificarea vizitatorului despre trimiterea unui mesaj.
3. Forma mesajului trimis care va fi trimis prin e-mail.
Creați o bucată cu un șablon de formular de feedback
Înainte de a crea o bucată cu un șablon pentru un formular de feedback, să studiem codul care descrie acest formular în șablonul nostru. Deschideți fișierul în Notepad++ contact.html care se află în folderul C:/xampp/htdocs/site/www/assets/templates/templatemo_250_chess/. Acestea vor fi liniile cu 135 De 159 inclusiv. După cum puteți vedea, acesta este un container cu id="form_contact", care este locul unde se află formularul nostru. Folosind acest cod ca bază, creăm o nouă bucată form-tplși adăugați substituenții de care avem nevoie:
Părere
[+mesaj de validare+]
Se generează codul care conține apelul pentru fragmentul AjaxForm
Deschidem șablonul care va folosi resursa și introducem codul care va implementa toate acestea.
[[!AjaxForm? &form=`tpl.AjaxForm` &snippet=`FormIt` &hooks=`FormItSaveForm, email` &emailSubject=`Mesajul de testare` &emailTo=` [email protected]` &emailFrom=` [email protected]` &emailTpl=`tpl.email` &validate=`name:minLength=^2^,email:email:required,message:minLength=^10^` &validationErrorMessage=`Formularul conține erori!` &successMessage=`Mesajul trimis cu succes` ] ]
Să ne uităm la parametrii principali:
- &form – este responsabil pentru fragmentul care conține formularul (tpl.AjaxForm).
- &snippet - fragment care procesează formularul (FormIt).
- &hooks – cârlige pe care fragmentul FormIt le va executa după validarea cu succes a formularului (1 - FormItSaveForm , 2 - e-mail). Cârligele sunt scripturi care sunt lansate după ce formularul a trecut validarea. Acestea sunt specificate separate prin virgule și rulează secvenţial unul după altul. Dacă apare o eroare într-una dintre ele, celelalte nu pornesc. În acest tutorial vom folosi 2 cârlige. Cârligul FormItSaveForm este conceput pentru a salva un formular în baza de date. Cârligul de e-mail este conceput pentru a trimite datele formularului prin e-mail.
- &emailSubject , &emailTo , &emailFrom , &emailTpl – parametri ale căror valori sunt utilizate de hook-ul de e-mail. Acestea sunt menite să indice subiectul scrisorii (&emailSubject), adresa de trimitere (&emailTo), antetul De la (&emailFrom) și șablonul scrisorii (&emailTpl).
- &validate – parametru bazat pe valoarea căreia este validat formularul. Valoarea parametrului este o listă de elemente separate prin virgule. Fiecare element constă din numele elementului de formular (care trebuie verificat) și regula (cerințele pentru acesta), separate prin două puncte. De exemplu, validatorul name:minLength=^2^ verifică dacă câmpul nume conține cel puțin 2 caractere. Validatorul email:email:required verifică dacă câmpul de e-mail conține o adresă de e-mail. Regulile de bază pentru crearea validatorilor pot fi găsite pe pagina „FormIt Validators”.
- &validationErrorMessage - conține un mesaj care va fi afișat dacă formularul conține erori.
- &successMessage - mesajul pe care utilizatorul îl va vedea dacă mesajul este trimis cu succes.
Tot ce rămâne este să creați o bucată tpl.email, care va conține șablonul de scrisoare.
Mesaj
De la: [[+nume]]
E-mail: [[+email]]
Telefon: [[+telefon]]
Mesaj: [[+message]]
MODX - Chunk tpl.emailAtenție: Pentru afișarea valorilor câmpurilor de formular se folosesc substituenți.
Demonstrarea modului în care funcționează formularul de feedback
Vom demonstra punctele principale atunci când lucrați cu formularul de feedback de pe pagină folosind următoarele imagini.
MODX - Formularul de feedback nu a fost validat
Aproape toate site-urile comerciale au o pagină de contact, care conține un formular de contact prin care utilizatorii pot scrie către administrația site-ului. Astăzi vom vedea cum să creați rapid Formular de contact. Vom implementa formularul de feedback folosind pachetul Formitîmpreună cu pachetul AjaxForm, instalați-le dacă nu le aveți instalate.
Crearea unui formular de feedback pe MODX Revo cu permisiunea de prelucrare a datelor cu caracter personal în conformitate cu Legea nr. 152-FZ „Cu privire la datele cu caracter personal” din 27 iulie 2006.
În primul rând, creăm o bucată în care va fi stocată forma în sine, să fie fragmentul „kontact-form” și plasăm codul în ea forma standard, fac în principal site-uri web folosind bootstrap, așa că voi lua șablonul standard ușor modificat, codul său static va fi așa:
Ta aspect va fi diferit, deoarece forma mea este stilizată în funcție de proiect, stiluri css Nu văd rostul să-l postez.
Aici puteți vedea alte forme getbootstrap.com/css/#forms
Acum să convertim codul în dinamic, ținând cont de sintaxă FormitȘi AjaxForm, obținem următoarele.
Acum să creăm o altă bucată care va genera o scrisoare, să o numim tpl-kontact-form cu următorul conținut:
Nume: [[+nume]]
E-mail: [[+email]]
Telefon: [[+pfone]]
Mesaj: [[+message]]
Ei bine, a devenit posibil să tragem o concluzie la locul potrivit:
[[!AjaxForm? &snippet=`FormIt` &form=`kontact-form` &emailTpl=`tpl-kontact-form` &hooks=`spam,email` &emailSubject=`Mesaj de pe site-ul [[++site_url]]` &emailTo=` [email protected]` &validate=`name:required,email:required` &validationErrorMessage=`Formularul conține erori!` &successMessage=`Mesajul trimis cu succes!` ]]
Nu uitați să schimbați valoarea emailTo la adresa ta de e-mail.
Documentatia componentelor:
- FormIt — docs.modx.com/extras/revo/formit
- AjaxForm — docs.modx.pro/components/ajaxform
Practic asta este!