Modx nadsilannya formi na poshtu.
topshirish Golovna Menda FormIt-da shakllarni qanday yaratish bo'yicha juda ko'p darslar bor, bu ba'zi afzalliklarga ega: shakllarni qayta yuklamasdan yuborish, yangilanish yuborilgandek ko'rinadi va hokazo.
Xo'sh, va, albatta, kamchiliklari: kod js va tomonidan taqdim etiladi
css fayli
- bu tezlikka minus beradi va ko'rsatilgan js bosishda turni talab qilmaydi, bu orqali validator oldindan ko'rsatadi - html 5 da uni ko'rsatish shart emas.
Shuning uchun men sof FormIt-da shakllar ustida ishlashga qaror qildim va bugun bu dars haqida bilib oldim.
Shaklning HTML tartibi quyidagi kodni o'z ichiga oladi:
Hech qanday maxsus narsa yo'q, shuning uchun standartni bootstrap 4 da belgilash bilan o'tkazing. Keling, uni to'g'ri sintaksis bilan qayta ishlaymiz va bitta dasturda u rad etiladi, ruslashtiriladi va biz spamdan himoyani qo'shamiz:Tabriklaymiz:
[[!+fi.error.message]] [[+fi.message]] Yuborish
Keling, kodni ko'rib chiqamiz va pastga tushamiz:
&ilgaklar - bu yerda turli ilgaklar qo'shilgan, jumladan, o'z-o'zidan yozilganlari: bizning versiyamizda ikkita standart mavjud: span - spam va elektron pochtadan oddiy himoya - oddiy, ma'lumotlarni yuborish uchun.
Pochta skrinshoti
.
Men sizga videodagi kancalar haqida aytib beraman.
&emailTpl - varaq dizayniga ega bo'lak, quyidagi kodni o'z ichiga oladi: Kimdan: [[+name]] Telefon: [[+telefon]]
E-mail: [[+email]]
Xabar: [[+message]]
&emailTo - shakl qo'llaniladigan elektron pochta manzillari,
bu yigitga
tizim sozlanmagan (kalit) ++emailsender
&emailSubject - varaqning suiiste'mol qilinayotgan mavzusi
Enctype = "ko'p qismli/form-ma'lumotlar"
Va faylni biriktirish uchun maydonlarni qo'shishingiz kerak
Belgilash katakchalari va variantlarni qayta ishlash
Bir tomondan bir nechta shakllar
Faqat teri shaklini harflar bilan yozing
&submitVar=`Men ingliz tilidaman`
teri shakli o'z nomiga ega.
Spamga qarshi kurash
Buni qanday aytishingizdan qat'iy nazar, siz albatta spamga tushib qolasiz - juda samarali usul u bilan kurashish uchun, uni o'zingiz sinab ko'rishingiz mumkin.
FormIt 3.0 ariza topshirishlarni hisoblashda foydalaniladigan hisoblash usullariga yangilanishlarni taqdim etadi.
Taxminan 3.0, mcrypt 3.0 openssl bilan almashtirilgandan beri almashtirildi, shuning uchun mcrypt PHP 7.2 dan boshlab joriy qilingan.
FormIt 3.0 boshqaruvchidan kirish mumkin bo'lgan migratsiya sahifasidan vikorizatsiya qilingan.
FormIt 2.2.9 dan boshlab barcha maydonlar avtomatik ravishda qo'llaniladi.
Saqlash/qiziqish uchun HTML teglarini yaratish uchun siz ba'zi HTML teglarini saqlash uchun barcha sohalarda maxsus Chars validatoridan foydalanishingiz kerak. FormIt 1.1.4 dan boshlab barcha maydonlar avtomatik ravishda teglar qo'llaniladi. Saqlash/qiziqish uchun HTML teglarini yaratish uchun barcha sohalarda Teglar validatoridan foydalanishingiz kerak, ba'zi teglarning qo'llab-quvvatlanishi maqtovga sazovor. Qanday foydalaniladi Foydalanmoqchi boʻlgan shaklni joylashtirish uchun “Resurs”ga “Form It” snippet chaqiruvini qoʻying.
Shunga o'xshash oldingi versiyalardan qat'i nazar (eng muhimi, MODX Evolution'da eForm), siz Chunk-da shaklni boshlay olmaysiz va Chunk-ga FormIt snippet qo'ng'irog'ida aytolmaysiz: ishlov berish uchun siz tom ma'noda siz xohlagan shaklga parcha qo'ng'irog'ini boshlaysiz. Snippet chaqiruvida "kancalar" (yoki tasdiqlashdan keyingi ishlov berish skriptlari) ni belgilang. Keyin orqali tasdiqlashni qo'shing
&tasdiqlash
va
| &customValidators | snippet tegidagi parametrlar. | Agar sahifada juda ko'p shakllar bo'lsa, o'rnating |
|---|---|---|
| &submitVar | Snippet-dagi xususiyatni shakl ichidagi shakl elementi nomiga chaqirish (ya'ni, &submitVar=`form1-submit`). | |
| Bu FormIt-ga ushbu POST o'zgaruvchisi bilan shakl so'rovlarini bajarish jarayonini bajarishni aytadi. | Qaysi skriptlarni yoqish kerak, agar mavjud bo'lsa, yuklangandan so'ng, preHooks ê tugadi va barcha maydonlar va xatolar o'rnatildi. | |
| Bu vergul bilan ajratilgan Ro'yxat bo'lishi mumkin, u shaklning barcha sohalarini qamrab olish uchun ishlatiladi, bularning barchasi boshqa paketlar yoki preHooksdagi bir xil ma'lumotlarga asoslangan. | Kancadan ushbu parchani bajaradigan Snippet nomidan ham foydalanish mumkin. | |
| ilgaklar | Shakl tekshiruvdan o'tgandan so'ng, agar mavjud bo'lsa, qanday skriptlar yoqiladi. | |
| Bu vergul bilan ajratilgan ro'yxati bo'lishi mumkin va agar birinchi bo'lib bajarilmasa, davom etayotganlar o'chirilmaydi. | Kancadan ushbu parchani bajaradigan Snippet nomidan ham foydalanish mumkin. | |
| submitVar | Agar tanlasangiz, jarayonni tanlamang, chunki bu POST parametri o'tkazib yuborilmaydi. | Eslatma: Agar siz &store xususiyatidan foydalansangiz talab qilinadi (+ input="submit" da submit varni o'rnating!). |
| tasdiqlash | O'ng tugmani bosish orqali sizga har bir maydon nomi ê name:validator (masalan: username:required, email:required) bilan tasdiqlash haqida xabar olasiz. | Tekshiruvchilar email:email:required kabi zanjirlangan bo'lishi mumkin. |
| Bu bir nechta satrlarda belgilanishi mumkin. | validationErrorMessage | Tekshiruvchilar email:email:required kabi zanjirlangan bo'lishi mumkin. |
| Tasdiqlash bajarilmasa, [[!+fi.validation_error_message]] oʻrinbosariga oʻrnatish uchun Zagalna xabari. | Yuqoridagi barcha xatolar roʻyxatini koʻrsatmoqchi boʻlsangiz, [[+xatolar]] boʻlishi mumkin. | |
| Shaklni tekshirishda xatolik yuz berdi. | Iltimos, kiritgan qiymatlaringizni tekshiring. | 1 |
| validationErrorBulkTpl | Umumiy tekshirish xato xabari qiymatidagi har bir alohida xato uchun ishlatiladigan HTML tpl. | 0 |
| [[+xato]] | errTpl | 300 |
| Xato xabarlari uchun html qo'shing. | Eslatma: bo'lak yo'q, faqat to'g'ri HTML. | customValidators |
| Vergul bilan ajratilgan ro'yxatida siz ushbu shaklda vikorist qilishni rejalashtirgan maxsus validator nomlari (parchalar) . | Xushbo'y hid aybdor, lekin bu erda aniq aytilgan, aks holda hid yugurmaydi. | clearFieldsOnSuccess |
| Qayta yo'naltirilmaydigan tinglashning muvaffaqiyatli shakli bo'yicha maydonlar tozalanishi aniq. | do'kon | |
| muvaffaqiyatMessagePlaceholder | Muvaffaqiyatli xabarni o'rnatish uchun bu mening joy ushlagichim. | fi.successMessage |
| qayta yo'naltirish | "Rahmat" sahifasining sahifa identifikatori, bu erda tashrif buyuruvchi shaklni muvaffaqiyatli to'ldirgandan so'ng kirishi mumkin va bu parametr "qayta yo'naltirish" ni &kancalar ro'yxatiga kiritsangizgina o'qiladi. | |
| allowFiles | Fayllarni joylashtirishga ruxsat yoki yo'qligini belgilang. | Ko'p bosqichli qisqa shakllarni kesish uchun davriy katalogda ro'yxatdan o'tgan fayllarni oldingi fayllardan oldin joylashtiring. |
| rost | attachFilesToEmail | Ko'p bosqichli qisqa shakllarni kesish uchun davriy katalogda ro'yxatdan o'tgan fayllarni oldingi fayllardan oldin joylashtiring. |
E-pochtaga yuklangan fayllarga e'tibor bering, forma uchun set enctype="multipart/form-data" talab qilinadi.
Tasdiqlash
FormIt-ni o'zgartirish &validate xususiyati orqali amalga oshiriladi va uni avtomatik ravishda formangizdagi istalgan maydonda tekshirish uchun ishlatish mumkin.
FormIt-da tekshirish haqida qo'shimcha ma'lumot olish uchun qarang Dars, kim eshik shakliga qarasa qo'ng'iroqning qo'ng'irog'i
CMF MODX Revolution, vikoryst komponentlari AjaxForm va FormIt.
FormIt va AjaxForm komponentlarini tayinlash FormIt - bu MODX Revolution uchun komponent (SNIPET), server tomonida shakllarni qayta ishlash uchun ishlatiladi. Oldin forma maydonlarini (tasdiqlash) tekshirishingiz mumkin
keyingi harakatlar , saytni spamni olib tashlashdan himoya qiling, shakl ma'lumotlarini elektron pochta orqali yuboring, to'ldirilgan shakllarning nusxalarini saqlang, boshqa saytga yo'naltirishni yarating (masalan, shaklni elektron pochta orqali muvaffaqiyatli topshirgandan so'ng), avtomatik yuborish funksiyasini o'chirib qo'ying. kel. Biroq, FormIt bilan AJAX orqali ishlash uchun siz vikory dan foydalanishingiz kerak
qo'shimcha komponent
AjaxForm.
Shlyuzning robot shakli printsipi MODX Revolution shlyuzining batafsil shakliga o'tishdan oldin, robotning asosiy algoritmini ko'rib chiqaylik. Joriy sahifani forma bilan ochgandan so'ng (serverda sahifa yaratishda AjaxForm snippetidagi &form parametrida ko'rsatilgan bo'lakdan olingan) foydalanuvchi uni tugatishga o'tadi.
To'ldirishni tugatgandan so'ng, foydalanuvchi "Yuklash" tugmasini va AjaxForm komponentini bosadi (
MODX Revolution-da aylanma yo'lning shaklini yaratish uchun siz quyidagi asosiy shartlarni kiritishingiz kerak:
Keling, hisobotning 2 va 4 boblarini ko'rib chiqaylik.
Chantsi tomonidan HTML formalarini yaratish
Shlyuz havolasi bilan HTML formasini yaratish tpl.AjaxForm.example shablonini qo'shimcha ravishda nusxalash orqali yaratilishi mumkin.
Misol uchun, ko'chirilgan bo'lakka tpl.AjaxForm nomini bering.
- Endi bu bo'lakda 3 ta maydondan iborat tayyor HTML formasi bo'lishi mumkin: Ism, E-mail va Xabar.
- Shakl bilan ishlashni talab qiladigan asosiy faoliyatlar asosan yangi toifalarni qo'shish yoki mavjudlarini olib tashlashga qisqartiriladi.
Kategoriya ostida bir-biriga bog'langan elementlar guruhi mavjud: yorliq, shakl elementi (kirish, tanlash, matn maydoni) va span elementi (tasdiqlashni ko'rsatish uchun ishlatiladi).
Asosiy fikrlar: Yorliq matni (yorliq elementi). Lug'atdan (boy saytlar uchun) yoki to'g'ridan-to'g'ri qo'shimcha matn uchun foydalaning. Span elementi sinf atributi va error_name qiymatlariga bo'ysunadi, bunda nom iborasi shakl elementi nomi atributining qiymatiga o'zgartirilishi kerak, buning uchun kengaytirish kerak emas.:
AJAXsiz.
Ismni kiriting
Elektron pochta*
Elektron pochtani kiriting Telefon Telefon raqamini kiriting Telefon Tabriklaymiz*
Toza
- AjaxForm snippetidan qasos olish uchun kod yaratish
- Biz noyob manba bo'lgan shablonni ochamiz va hamma narsa uchun ishlatiladigan kodni kiritamiz.
- & ilgaklar – shakl muvaffaqiyatli yangilangandan so‘ng FormIt snippetini tashkil etuvchi ilgaklar (1 - FormItSaveForm, 2 - elektron pochta).
- Kancalar - bu shakl tasdiqlangandan keyin ishga tushiriladigan skriptlar.
- Ular kimdir orqali buyurtma qilinadi va birma-bir ishga tushiriladi.
- Agar ulardan birida muammo bo'lsa, yechim boshlanmaydi.
- Ushbu darsda biz 2 ta kancadan foydalanamiz.
FormItSaveForm kancasi ma'lumotlar bazasida shakllarni saqlash uchun ishlatiladi.
Pochta bo'limida nadsilannya ma'lumotlar shakllari uchun Hook elektron pochta topshiriqlari.
&ilgaklar - bu yerda turli ilgaklar qo'shilgan, jumladan, o'z-o'zidan yozilganlari: bizning versiyamizda ikkita standart mavjud: span - spam va elektron pochtadan oddiy himoya - oddiy, ma'lumotlarni yuborish uchun.
.
Pochta skrinshoti
Men sizga videodagi kancalar haqida aytib beraman.
&emailSubject, &emailTo, &emailFrom, &emailTpl – vikorist elektron pochta kancasining parametrlari, ma'nolari.
Ular varaq mavzularini (&emailSubject), yuborish manzili (&emailTo), Sarlavhadan (&emailFrom), varaq shablonini (&emailTpl) kiritish uchun ishlatiladi.
&validate - shaklni tekshirish qiymatiga asoslangan parametr.
Parametr qiymatlari guruhlarga bo'lingan elementlarning ro'yxati.
Teri elementi shakl elementi nomidan (uni tekshirish kerak) va qoidalardan (oldin bo'lishi mumkin) hosil bo'ladi, bir-biridan qo'shaloq belgi bilan ajratiladi. 
Masalan, name:minLength=^2^ validator nom maydonida kamida 2 ta belgi borligini tekshiradi. Email:email:kerakli tekshiruvchi pochta maydoni elektron pochta manziliga mos kelishini tekshiradi. Validatorlarni yaratishning asosiy qoidalarini "FormIt Validators" sahifasida topish mumkin. &validationErrorMessage - agar formada xatolar bo'lsa, ko'rsatiladigan bildirishnomani ko'rsating.&successMessage - mijozga xabarnoma muvaffaqiyatli yuborilishi haqida xabar berish uchun bildirishnoma.
Men tpl.email bo'lagini yaratish qobiliyatini yo'qotdim, bu noto'g'ri ish varag'i shablonidir.
Avvalo, biz shaklning o'zi saqlanadigan bo'lak yaratamiz, keling, "kontakt-shakl" qismini unutmang va uni standart shaklning yangi kodiga joylashtiramiz, men asosan yuklash wikilari bilan saytlar quraman, shuning uchun men' Men standartni olaman, biroz qayta ishlangan, bu statik kod quyidagicha bo'ladi:
Sizning tashqi ko'rinish Mening formam loyiha uchun stilize qilingani ajablanarli bo'ladi, css uslublari vikladati ne bachu sensu.
Bu erda siz boshqa shakllarni ko'rishingiz mumkin getbootstrap.com/css/#forms
Va endi dinamik kodni to'g'ri sintaksisga muvofiq qayta ishlaymiz. Email:email:kerakli tekshiruvchi pochta maydoni elektron pochta manziliga mos kelishini tekshiradi.і &validationErrorMessage - agar formada xatolar bo'lsa, ko'rsatiladigan bildirishnomani ko'rsating., Keling, qadam tashlaylik.
Endi buning o'rniga tpl-kontact-form deb nomlangan boshqa bo'lakni, shakllantiriladigan varaqni yaratamiz:
Ism: [[+ism]]
Email: [[+email]]
Telefon: [[+pfone]]
Men sizga videodagi kancalar haqida aytib beraman.
To'g'ri joydan o'rganishni boshlash mumkin bo'ldi:
[[! AjaxForm? Telefon&snippet=`FormIt` &form=`kontact-form` &emailTpl=`tpl-kontact-form` &hooks=`spam,email` &emailSubject=`Sayt haqida ma`lumot [[++site_url]]` &emailTo=`
` &validate=`name:required,email:required` &validationErrorMessage=`Shakl tugash arafasida!` &successMessage=`Xabarnoma muvaffaqiyatli yuborildi!` ]] Qiymatni o'zgartirishni unutmang email
pochta bo'limingizga.
- Komponent hujjatlari: — FormIt
- &validationErrorMessage - agar formada xatolar bo'lsa, ko'rsatiladigan bildirishnomani ko'rsating. — docs.modx.com/extras/revo/formit
docs.modx.pro/components/ajaxform
