Modx revo formátumbeállítások. Visszajelzési űrlap a MODX Revo-ról a Formit használatával, szokatlan captcha-val. Mi az a FormIt
A FormIt 3.0 frissítést vezet be az űrlapbeküldések titkosításához használt titkosítási módszerekhez. A 3.0 előtt mcryptet használtak, amit a 3.0-ban openssl váltott fel, mivel az mcrypt a PHP 7.2-től elavulttá vált. A FormIt 3.0-hoz tartozik egy migrációs oldal, amely a kezelőtől érhető el.
A FormIt 2.2.9-től kezdve minden mezőre automatikusan alkalmazzák a html_entities értéket. A HTML-címkék mentésének/tárolásának engedélyezéséhez minden mezőben az allowSpecialChars érvényesítőt kell használnia, amely a nyers HTML-címkéket menti.
A FormIt 1.1.4-es verziójától kezdve minden mezőre automatikusan stripTag kerül alkalmazásra. A HTML-címkék mentésének/tárolásának engedélyezéséhez minden mezőben az allowTags érvényesítőt kell használnia, meghatározva, hogy mely címkék engedélyezettek.
Hogyan kell használni
Egyszerűen helyezze a FormIt kódrészlet hívását abba az erőforrásba, amely a használni kívánt űrlapot tartalmazza. A hasonló elődöktől eltérően (leginkább az eForm a MODX Evolutionben), nem kell az űrlapot Chunk-ba helyezni, és a Chunk-ra hivatkozni a FormIt snippet call: you literally put the snippet call side the form side, you want to feldolgozni. Adja meg a "horgokat" (vagy az ellenőrzés utáni feldolgozási szkripteket) a kódrészlethívásban. Ezután adja hozzá az érvényesítést a &érvényesítés &customValidators paramétereket a kódrészlet címkéjében.
Ha több űrlap van egy oldalon, állítsa be a &submitVar tulajdonsága a Snippet-hívásban az űrlapon belüli űrlapelem nevére (pl. &submitVar=`form1-submit`). Ez azt mondja a FormIt-nek, hogy csak az adott POST-változóval rendelkező űrlapkéréseket dolgozza fel. Több űrlapot kell használni az INPUT type="submit" name="form1-submit" paraméterrel, a gombelemek a jelentések szerint nem működnek.
Elérhető tulajdonságok
Ezek a FormIt hívás elérhető általános tulajdonságai (a horogspecifikus tulajdonságok nélkül):
| Név | Leírás | alapértelmezett érték |
|---|---|---|
| preHook | Milyen szkripteket kell elindítani, ha vannak ilyenek az űrlap betöltése után. Ez lehet a horgok vesszővel elválasztott listája, és ha az első sikertelen, a továbbhaladók nem fognak tüzelni. A hook lehet egy Snippet név is, amely végrehajtja az adott Snippet-et. | |
| renderHooks | Milyen szkripteket kell elindítani, ha vannak ilyenek, ha az űrlap betöltődik, a preHook befejeződött, és minden mező és hiba be van állítva. Ez lehet egy vesszővel elválasztott lista, amely az űrlap összes mezőjének manipulálására szolgál, mielőtt minden más csomagokból vagy preHook-okból származó adatok alapján beállna. A hook lehet egy Snippet név is, amely végrehajtja az adott Snippet-et. | |
| horgok | Milyen szkripteket kell elindítani, ha vannak ilyenek, miután az űrlap átment az ellenőrzésen. Ez lehet egy vesszővel elválasztott lista, és ha az első sikertelen, a továbbhaladók nem indulnak el. A hook lehet egy Snippet név is, amely végrehajtja az adott Snippet-et. | |
| submitVar | Ha be van állítva, akkor nem indul el az űrlapfeldolgozás, ha ez a POST változó nem kerül átadásra. Figyelmeztetés: Szükséges, ha a &store tulajdonságot használja (+ az input="submit"-ben állítsa be a submit var-t!). | |
| érvényesít | Az érvényesítendő mezők vesszővel elválasztott listája, minden mezőnévvel: name:validator (pl.: felhasználónév:kötelező, e-mail: kötelező). Az érvényesítők láncba is köthetők, például email:email:required . Ez a tulajdonság több sorban is megadható. | |
| validationErrorMessage | Általános hibaüzenet, amelyet helyőrzőre kell beállítani [[!+fi.validation_error_message]], ha az ellenőrzés sikertelen. Tartalmazhat [[+hibákat]], ha az összes hiba listáját szeretné megjeleníteni a tetején. | Űrlapérvényesítési hiba történt. Kérjük, ellenőrizze a megadott értékeket. |
| validationErrorBulkTpl | HTML tpl, amely az általános érvényesítési hibaüzenet értékének minden egyes hibájához használatos. | [[+hiba]] |
| errTpl | A hibaüzenetek burkoló html-je. Megjegyzés: nem egy darab, csak egyenes HTML. | [[+hiba]] |
| customValidators | Az ezen az űrlapon használni kívánt egyéni érvényesítő nevek (részletek) vesszővel elválasztott listája. Ezeket itt kifejezetten fel kell tüntetni, különben nem futnak le. | |
| clearFieldsOnSuccess | Ha igaz, akkor törli a mezőket a sikeres űrlapküldésnél, amely nem irányít át. | 1 |
| bolt | Ha igaz, akkor a gyorsítótárban tárolja az adatokat a FormItRetriever kódrészlet segítségével történő lekérdezéshez. | 0 |
| storeTime | Ha a "store" értéke igaz, ez megadja, hogy hány másodpercig kell tárolni az űrlap elküldéséből származó adatokat. Alapértelmezés szerint öt perc. | 300 |
| bolt helye | A store használatakor ez határozza meg, hogy az űrlapot hol tárolja a rendszer az elküldés után. A lehetséges opciók a "gyorsítótár" és a "munkamenet". Alapértelmezés szerint "gyorsítótár". | gyorsítótár |
| helyőrzőPrefix | A FormIt által a mezőkhöz beállított összes helyőrzőhöz használandó előtag. Ügyeljen arra, hogy tartalmazza a "." elválasztót az előtagban. | fi. |
| sikerüzenet | Ha nem használja az átirányítási horgot, akkor a sikeres elküldés után jelenítse meg ezt a sikerüzenetet. | |
| sikerMessagePlaceholder | A helyőrző neve, amelyre a sikerüzenetet be kell állítani. | fi.successMessage |
| redirectTo | egy "Köszönöm" oldal oldalazonosítója, ahová az űrlap sikeres elküldése után el lehet küldeni a látogatót, de ez a paraméter CSAK akkor olvasható, ha az &hook listájában szerepel az "átirányítás". | |
| enableFiles | Adja meg, hogy engedélyezett-e a fájlok közzététele. A beküldött fájlok egy ideiglenes könyvtárban tárolódnak, hogy megakadályozzák a fájlok elvesztését a többlépcsős űrlapokon. | igaz |
| attachFilesToEmail | Az e-mailben feltöltött fájlokat csatolja, az űrlapot enctype="multipart/form-data"-ra kell beállítani | igaz |
Érvényesítés
Az érvényesítés a FormIt-ben a &validate tulajdonságon keresztül történik, és az űrlap bármelyik mezőjének automatikus ellenőrzésére használható.
A FormIt-ben való érvényesítéssel kapcsolatos további információkért lásd a
Már csak egy oldalunk van, amit még nem készítettünk el. Ez az oldal Kapcsolatok. Itt amellett Elérhetőség az űrlap található Visszacsatolás. A MODx-ben van egy speciális kódrészlet egy ilyen űrlap létrehozásához - eForm. Először nézzük meg, hogy általában miből állhat a visszajelzési űrlap.
1. Először is ez maga az űrlap beviteli mezőkkel név, postázási cím, Üzenettémaés önmagát üzenetek. A spam elleni védelem érdekében adjon hozzá egy captcha-t - egy űrlapot a kód beírásához egy generált képből. Lehetővé kell tenni a bevitt adatok érvényesítését is.
2. A látogató értesítése az üzenet elküldéséről.
3. Az elküldött üzenet formája, amely a postára érkezik.
Hozzon létre egy darabot visszajelzési űrlapsablonnal
Mielőtt a visszajelzési űrlaphoz egy sablont tartalmazó darabot hozna létre, vizsgáljuk meg az űrlapot leíró kódot a sablonunkban. Nyissa meg a fájlt a Notepad++ alkalmazásban contact.html amely a C:/xampp/htdocs/site/www/assets/templates/templatemo_250_chess/ mappában található. Ezek lesznek a sorok 135 tovább 159 inkluzív. Amint látja, ez egy konténer id="contact_form", amely az űrlapunkat tartalmazza. A kód alapján hozzon létre egy új darabot form-tplés adja hozzá a szükséges helyőrzőket:
Visszacsatolás
[+érvényesítési üzenet+]
AjaxForm kódrészlethívást tartalmazó kód létrehozása
Megnyitjuk az erőforrást használó sablont, és beírjuk a kódot, amely mindezt elvégzi.
[[!AjaxForm? &form=`tpl.AjaxForm` &snippet=`FormIt` &hooks=`FormItSaveForm,email` &emailSubject=`Tesztüzenet` &emailTo=` [e-mail védett]`&emailFrom=` [e-mail védett]` &emailTpl=`tpl.email` &validate=`name:minLength=^2^,email:email:required,message:minLength=^10^` &validationErrorMessage=`Az űrlap hibákat tartalmaz!` &successMessage=`Üzenet sikeresen elküldve` ] ]
Elemezzük a főbb paramétereket:
- &form – az űrlapot tartalmazó csonkért felelős (tpl.AjaxForm).
- &kódrészlet – az űrlapot feldolgozó részlet (FormIt).
- &hooks – akasztók, amelyeket a FormIt kódrészlet az űrlap sikeres érvényesítése után hajt végre (1 - FormItSaveForm , 2 - email). A horgok olyan szkriptek, amelyek az űrlap érvényesítése után futnak le. Vesszővel vannak elválasztva, és egymás után futnak. Ha az egyikben hiba lép fel, a többi nem indul el. Ebben az oktatóanyagban 2 horgot fogunk használni. A FormItSaveForm hook az űrlap adatbázisba mentésére szolgál. Az e-mail hook az űrlapadatok e-mailbe küldésére szolgál.
- Az &emailSubject , &emailTo , &emailFrom , &emailTpl olyan paraméterek, amelyek értékeit az e-mail hook használja. Az e-mail tárgyának (&emailSubject), küldési címének (&emailTo), feladójának (&emailFrom) és e-mail sablonjának (&emailTpl) megadására szolgálnak.
- Az &validate egy paraméter, amelynek értéke alapján az űrlap érvényesítésre kerül. A paraméter értéke az elemek vesszővel elválasztott listája. Minden elem az űrlapelem nevéből (ellenőrizendő) és a szabályból (a rá vonatkozó követelményekből) áll, kettősponttal elválasztva. Például a name:minLength=^2^ érvényesítő ellenőrzi, hogy a névmező tartalmaz-e legalább 2 karaktert. Az email:email:required érvényesítő ellenőrzi, hogy a levélmező tartalmaz-e e-mail címet. Az érvényesítők létrehozásának alapvető szabályai a "FormIt Validators" oldalon találhatók.
- &validationErrorMessage – Az üzenetet tartalmazza, amely akkor jelenik meg, ha az űrlap hibákat tartalmaz.
- &successMessage – az üzenet, amelyet a felhasználó látni fog, ha az üzenet sikeresen elküldésre került.
Már csak egy darab tpl.email létrehozása van hátra, amely tartalmazza az e-mail sablont.
Üzenet
Feladó: [[+név]]
E-mail: [[+e-mail]]
Telefon: [[+telefon]]
Üzenet: [[+üzenet]]
MODX – Chunk tpl.email
Figyelem: A helyőrzők az űrlapmezők értékeinek megjelenítésére szolgálnak.
A visszajelzési űrlap bemutatása
A következő képek segítségével bemutatjuk a főbb pontokat, amikor az oldalon található visszajelzési űrlappal dolgozunk.
MODX – Érvénytelen kapcsolatfelvételi űrlap 
Szinte minden kereskedelmi oldal rendelkezik kapcsolatfelvételi oldallal, amely egy kapcsolatfelvételi űrlapot tartalmaz, amelyen keresztül a felhasználók írhatnak az oldal adminisztrációjának. Ma megnézzük, hogyan lehet gyorsan létrehozni egy kapcsolatfelvételi űrlapot. A visszajelzési űrlapot a csomag segítségével fogjuk megvalósítani formátum kapcsolódik a csomaghoz Ajax forma, telepítse őket, ha még nincs telepítve.
Visszajelzési űrlap létrehozása a MODX Revo-ról személyes adatok feldolgozásának engedéllyel a 2006. július 27-én kelt 152-FZ „A személyes adatokról” törvény szerint.
Először is létrehozunk egy darabot, amelyben maga az űrlap kerül tárolásra, legyen ez a „kontakt-forma” darab, és belehelyezzük a kódot alapforma, Főleg bootstrap segítségével készítek oldalakat, ezért a standard sablont kicsit módosítva veszem, a statikus kódja így lesz:
A megjelenésed más lesz, ahogy a formám a projekthez készült, css stílusok Nem látom értelmét a posztolásnak.
A többi nyomtatványt itt tekintheti meg getbootstrap.com/css/#forms
És most alakítsuk át a kódot dinamikussá, figyelembe véve a szintaxist formátumés Ajax forma, a következőket kapjuk.
Most hozzunk létre egy másik darabot, amely egy betűt alkot, nevezzük tpl-kontakt-formnak a következő tartalommal:
Név: [[+név]]
E-mail: [[+e-mail]]
Telefon: [[+pfone]]
Üzenet: [[+üzenet]]
Nos, a megfelelő helyen kezdett levonni egy következtetést:
[[!AjaxForm? &snippet=`FormIt` &form=`kontact-form` &emailTpl=`tpl-kontact-form` &hooks=`spam,email` &emailSubject=`Üzenet a következő webhelyről: [[++site_url]]` &emailTo=` [e-mail védett]` &validate=`name:required,email:required` &validationErrorMessage=`Az űrlap hibákat tartalmaz!` &successMessage=`Az üzenet sikeresen elküldve!` ]]
Ne felejtse el megváltoztatni az értéket emailTo a postájára.
Alkatrész dokumentáció:
- FormIt — docs.modx.com/extras/revo/formit
- Ajax forma — docs.modx.pro/components/ajaxform
Lényegében ennyi!