در قسمت‌های قبلی آموزش گرویتی فرم به بررسی فیلدهای استاندارد پرداختیم و کاربرد هر یک از فیلدها را مورد بررسی قرار داده‌ایم. در این قسمت از دوره به توضیح ساختار شرطی در گرویتی فرم می‌پردازیم و کار کردن با آن‌ها در قالب چندین مثال بررسی می‌کنیم.

ساختار شرطی در گرویتی فرم

ساختار شرطی به مجموعه‌ای از فیلدها گفته می‌شود که نمایش آن‌ها مشروط به فیلد دیگیری باشد. در واقع، این فیلدها لازم و ملزوم یکدیگر هستند و شما می‌توانید شرایطی را تعیین کنید که در صورت وجود آن شرایط یک فیلد به کاربران نمایش داده شود. مثال: اگر شما یک فیلد تحت عنوان وضعیت تاهل در فرم خود ایجاد کرده باشید می‌توانید شرطی را قرار دهید که در صورتی‌که کاربر مقدار متاهل هستم را در این فیلد انتخاب کرده بود، فیلد جدیدی را به کاربر نمایش دهد و از او نام همسرش را دریافت کند.

به وابسته کردن نمایش یک فیلد به یک فیلد دیگر ایجاد شرط می‌گویند که به کمک این قابلیت می‌توانید فرم‌های هوشمندتری را تولید کرده و بسازید.

ساخت یک فرم جدید

برای استفاده از این گزینه ابتدا وارد افزونه گرویتی فرم شوید. سپس، از قسمت Blank form یک فرم خام ایجاد کنید و نام و توضیحات مربوطه را برای آن وارد کنید.

ذخیره عنوان و توضیح فرم
ذخیره عنوان و توضیح فرم

ساخت یک فیلد شرطی

اکنون می‌خواهیم همانند مثالی که در بالاتر گفته شد یک فیلد شرطی ایجاد کنیم، برای این کار ابتدا از بخش فیلد‌های استاندارد، فیلد دکمه‌های رادیویی را انتخاب می‌کنیم و آن را در فرم قرار می‌دهیم.

انتخاب فیلد دکمه‌های رادیویی
انتخاب فیلد دکمه‌های رادیویی

پس از اینکه فیلد دکمه‌های رادیویی را قرار دادیم باید برچسب و توضیحات را همانند سایر فیلدها برای آن مشخص کنیم. مثلا در قسمت برچسب وضعیت تاهل را وارد می‌کنیم و در قسمت توضیحات هم توضیحی را برای راهنمایی کاربر تعیین می‌کنیم.

وارد کردن عنوان و توضیحات فیلد
وارد کردن عنوان و توضیحات فیلد

برای ایجاد گزینه‌های مربوط به این فیلد هم روی گزینه “Edit Choices” کلیک کرده و گزینه‌های “مجرد هستم” و “متاهل هستم” را مشخص می‌کنیم.

تعیین گزینه متاهل و مجرد
تعیین گزینه متاهل و مجرد

در ادامه برای نمایش یک فیلد در صورتی‌که کاربر گزینه “متاهل هستم” را انتخاب کرده بود، از فیلد متن تک خطی استفاده کرده و آن را به فرم اضافه می‌کنیم.

افزودن فیلد متن تک خطی
افزودن فیلد متن تک خطی

برچسب فیلد را به نام و نام خانوادگی همسر تغییر می‌دهیم و یک توضیح را برای راهنمایی کاربر برای تکمیل فیلد در قسمت توضیحات وارد می‌کنیم.

تعیین عنوان و توضیحات فیلد متن تک خطی
تعیین عنوان و توضیحات فیلد متن تک خطی

برای اینکه این فیلد را به‌صورت شرطی نمایش دهیم تا فقط کاربرانی که گزینه “متاهل هستم” را انتخاب کرده‌اند، آن را مشاهده کنند، باید از گزینه منطق شرطی استفاده کنیم.

برای مشاهده گزینه منطق شرطی صفحه را به سمت پایین اسکرول می‌کنیم و در قسمت پایانی تنظیمات فیلد، گزینه منطق شرطی را فعال می‌کنیم.

انتخاب گزینه منطق شرطی
انتخاب گزینه منطق شرطی

حالا می‌بینید که روی صفحه ویرایشگر باید فعال‌سازی منطق شرطی را انتخاب کنیم تا این گزینه سبز شود.

فعالسازی گزینه منطق شرطی
فعالسازی گزینه منطق شرطی

وقتی این گزینه فعال شد، گزینه‌هایی روی صفحه ایجاد می‌شود که به ما این امکان را می‌دهد تا نمایش فیلد خود را بر اساس آن شرطی کنیم.

شرطی‌سازی با استفاده از گزینه‌های موجود
شرطی‌سازی با استفاده از گزینه‌های موجود

1- اولین چیزی که در تصویر بالا می‌بینیم، گزینه نمایش است که در ادامه آن اگر می‌آید. یعنی در صورتی‌که شرط‌های زیر وجود داشت، فیلد موردنظر را نمایش دهد.

2- بعد از اگر یک گزینه قرار دارد که ما باید از بین 2 گزینه “حداقل یکی” و “همه” یکی را انتخاب کنیم که ما در اینجا گزینه “حداقل یکی” را انتخاب می‌کنیم.

3- سپس، در ادامه فیلد قبلی فرم که “وضعیت تاهل” است قرار می‌گیرد و در گزینه بعدی از ما می‌خواهد که بازه یا مقدار تعیین‌شده را برای شرط خود تعیین کنیم که در این مثال، باید گزینه “هست” را انتخاب کنیم.

5- در قسمت بعدی باید گزینه‌ای که می‌خواهیم شرط در صورت وجود آن ظاهر شود را انتخاب کنیم. گزینه‌های موجود در این قسمت همان گزینه‌هایی هستند که در این فیلد مشخص کرده‌ایم.

ساخت فیلدهای شرطی تو در تو

ما برای ساخت فیلدهای شرطی در فرم خود محدودیت نداریم. مثلا اگر بخواهیم می‌توانیم در همین فرم علاوه‌ بر نام همسر از داشتن یا نداشتن فرزند هم مطلع شویم و اگر پاسخ مثبت بود از کاربر بخواهیم تعداد فرزندان خود را نیز وارد کند. برای ساخت این شرط کافیست یک فیلد شرطی دیگر به فرم خود اضافه کنیم.

برای این کار، مجددا از قسمت Add fields فیلد دکمه‌های رادیویی را به صفحه ویرایشگر فرم اضافه می‌کنیم.

انتخاب دکمه رادیویی در بخش اد فیلدز
انتخاب دکمه رادیویی در بخش اد فیلدز

برچسب فیلد را به این سوال که “آیا شما فرزند دارید” تغییر می‌دهیم.

پر کردن عنوان و توضیحات برای تعداد فرزندان
پر کردن عنوان و توضیحات برای تعداد فرزندان

سپس، در قسمت انتخاب‌ها و Edit choices دو گزینه “بله” و “خیر” را برای این فیلد مشخص می‌کنیم.

قرار دادن گزینه بله و خیر
قرار دادن گزینه بله و خیر

برای اینکه این فیلد تنها به کاربرانی نمایش داده شود که گزینه “متاهل هستم” را انتخاب کرده‌اند، روی آن کلیک کرده و در قسمت تنظیمات گزینه منطق شرطی را فعال می‌کنیم.

شرطی‌سازی فیلد فرزند
شرطی‌سازی فیلد فرزند

حالا باید نمایش این فیلد را تنها با وجود شرط “متاهل هستم” مشخص کنیم.

در ادامه اگر بخواهیم از افرادی که گزینه “بله” را در قسمت فرزند انتخاب کرده‌اند، تعداد فرزند را نیز وارد کنند، باید فیلد جدیدی را در فرم مشروط بر فیلد فرزند ایجاد کنیم. برای این کار فیلد عددی را به صفحه ویرایشگر فرم اضافه می‌کنیم.

اضافه کردن فیلد عددی
اضافه کردن فیلد عددی

پس از اینکه این فیلد به فرم ما اضافه شد برچسب فیلد را روی “تعداد فرزند” قرار خواهیم داد.

تعیین توضیح و برچسب تعداد فرزند
تعیین توضیح و برچسب تعداد فرزند

و در قسمت قوانین پر کردن آن را ضروری می‌کنیم تا کاربر ملزم به وارد کردن مقدار در این فیلد شود.

ضروری کردن پر کردن فیلد
ضروری کردن پر کردن فیلد

در ادامه قابلیت منطق شرطی را برای این فیلد فعال می‌کنیم و در قسمت گزینه‌ها نمایش آن را مشروط به فیلد “تعداد فرزندان” می‌کنیم.

شرطی‌سازی فیلد تعداد فرزندان
شرطی‌سازی فیلد تعداد فرزندان

مقدار و بازه شرط را هم روی گزینه “بله” تنظیم می‌کنیم تا اگر پاسخ کاربر به این فیلد مثبت بود، فیلد تعداد فرزندان به کاربر نمایش داده شود.

برای اعمال تغییرات ایجاد شده، روی گزینه “Save Form” کلیک می‌کنیم تا تغییرات ما ذخیره شود.

کلیک روی گزینه سیو فرم
کلیک روی گزینه سیو فرم

کلام پایانی

در این قسمت از دوره به بررسی ساختار شرطی در گرویتی فرم پرداختیم و با 2 مثال کاربردی شیوه استفاده از آن را به شما توضیح دادیم تا از این طریق بتوانید فرم‌های حرفه‌ای‌تری را برای سایت خود ایجاد کنید. امیدواریم که این آموزش برای شما مفید و کاربردی بوده باشد، در صورت وجود سوال از قسمت نظرات باما در ارتباط باشید.

نظرت راجب این مطلب چیه؟

هنوز امتیازی ثبت نشده است.
  • خیلی عالی
  • عالی
  • خوب
  • بد
  • خیلی بد
اگر سوال یا نظری راجب این مطلب دارید، به اشتراک بگذارید. ارسال دیدگاه

نوشتن دیدگاه

پس از ارسال دیدگاه، ایمیل شما به صورت عمومی نمایش داده نخواهد شد.