جعبه های انتخابی منفرد
انتخاب 2 می تواند یک جعبه انتخاب معمولی مانند این را بگیرد...
جعبه های چند انتخابی
انتخاب 2 همچنین از جعبه های انتخاب چند ارزشی پشتیبانی می کند. انتخاب زیر با ویژگی چندگانه اعلام می‌شود.
گروه های گزینه کشویی
در HTML، عناصر <option> را می توان با قرار دادن آنها در
یک عنصر <optgroup> گروه بندی کرد:
غیرفعال کردن گزینه ها
انتخاب 2 هنگامی که ویژگی disabled تنظیم شده باشد) و از srouces راه دور که در آن شیء غیرفعال شده است: true به درستی گزینه های غیرفعال را مدیریت می کند.
غیرفعال کردن کنترل انتخاب 2
انتخاب 2 به ویژگی disabled در عناصر <select> پاسخ می دهد. همچنین می‌توانید انتخاب 2 را با disabled: true مقداردهی اولیه کنید تا همین اثر را داشته باشید.
انتخاب 2 با برچسب
می‌توانید و باید از یک <label> با انتخاب 2 استفاده کنید، درست مانند هر عنصر <select>.
عرض کانتینر
دو باکس انتخاب 2 زیر به ترتیب به عرض 50% و 75% برای پشتیبانی از طراحی واکنش‌گرا طراحی شده‌اند:
تم ها
انتخاب 2 با استفاده از گزینه theme از تم های سفارشی پشتیبانی می کند تا بتوانید به انتخاب 2 استایل دهید تا با بقیه برنامه خود مطابقت داشته باشد.
Ajax (داده های راه دور)
انتخاب 2 با استفاده از متدهای AJAX جی کوئری با پشتیبانی AJAX ساخته شده است. در این مثال، می‌توانیم مخازن را با استفاده از API GitHub جستجو کنیم:
در حال بارگیری داده های آرایه
می‌توانید از گزینه پیکربندی data برای بارگیری گزینه‌های کشویی از یک آرایه محلی استفاده کنید.
انتخاب خودکار
با استفاده از گزینه selectOnbtn-close، می توان انتخاب 2 را طوری پیکربندی کرد که به طور خودکار نتیجه هایلایت شده فعلی را هنگامی که فهرست بازشو btn-close بسته می شود، انتخاب کند:
پس از انتخاب باز بماند
انتخاب 2 به طور خودکار با انتخاب یک عنصر، پنجره بازشو را با btn-بستن می بندد، مشابه کاری که با یک جعبه انتخاب معمولی انجام می شود. می‌توانید از گزینه btn-closeOnSelect برای جلوگیری از بسته شدن منوی کشویی هنگام انتخاب نتیجه استفاده کنید:
قرار دادن کرکره ای
گزینه dropdownParent به شما امکان می دهد یک عنصر جایگزین را برای فهرست کشویی انتخاب کنید تا به آن اضافه شود:
محدود کردن تعداد انتخاب ها
جعبه‌های انتخاب چند ارزشی انتخاب 2 می‌توانند محدودیت‌هایی را در مورد حداکثر تعداد گزینه‌های قابل انتخاب تعیین کنند. انتخاب زیر با ویژگی multiple با maximumSelectionLength در گزینه های انتخاب 2 اعلام می شود.
ایجاد گزینه پویا
علاوه بر یک منوی از پیش پر شده از گزینه ها، انتخاب 2 می تواند به صورت پویا گزینه های جدیدی را از ورودی متن توسط کاربر در کادر جستجو ایجاد کند. این ویژگی "برچسب" نامیده می شود. برای فعال کردن برچسب‌گذاری، گزینه tagstrue تنظیم کنید:
برچسب گذاری با جعبه های انتخاب چند ارزشی
همچنین می‌توان از برچسب‌گذاری در جعبه‌های انتخاب چند ارزشی استفاده کرد. در مثال زیر، ویژگی multiple="multiple" را بر روی یک کنترل انتخاب 2 که دارای tags: true نیز فعال است، تنظیم می کنیم:
متغیرهایی را انتخاب کنید
انتخاب 2 از نمایش مقدار مکان نگهدار با استفاده از گزینه پیکربندی placeholder پشتیبانی می کند. مقدار مکان نگهدار تا زمانی که انتخابی انجام شود نمایش داده می شود.
متغیرهایی را چند انتخاب کنید
برای انتخاب های چندگانه، باید not یک عنصر <option> خالی داشته باشید:
متغیرهای انتخاب پیش فرض
از طرف دیگر، مقدار گزینه placeholder می تواند یک شی داده ای باشد که انتخاب پیش فرض را نشان می دهد (<option>). در این مورد id شی داده باید مطابقت داشته باشد
value انتخاب پیش فرض مربوطه.
سفارشی کردن نحوه مطابقت نتایج
هنگامی که کاربران با وارد کردن عبارات جستجو در کادر جستجو، نتایج را فیلتر می کنند، انتخاب 2 از یک "مطابق" داخلی برای مطابقت عبارات جستجو با نتایج استفاده می کند. می‌توانید روشی را که انتخاب 2 با عبارات جستجو مطابقت می‌دهد، با تعیین یک تماس برای گزینه پیکربندی matcher سفارشی کنید.
تطبیق گزینه های گروه بندی شده
فقط اشیاء سطح اول به پاسخ تماس matcher ارسال خواهند شد. اگر با داده‌های تودرتو کار می‌کنید، باید از طریق آرایه children تکرار کنید و آنها را به‌صورت جداگانه مطابقت دهید. این امکان تطبیق پیشرفته تری را هنگام کار با اشیاء تودرتو فراهم می کند و به شما امکان می دهد هر طور که می خواهید آنها را مدیریت کنید.
حداقل طول عبارت جستجو
می‌توانید با استفاده از عبارت جستجو، حداقل طول عبارت جستجو را تعیین کنید
گزینه minimumInputLength:
حداکثر طول عبارت جستجو
شما می توانید حداکثر طول عبارات جستجو را با استفاده از عبارت محدود کنید
گزینه maximumInputLength:
به صورت برنامه ای گزینه های جدید اضافه کنید
با ایجاد یک شیء Option جدید جاوا اسکریپت و ضمیمه کردن آن به کنترل، می‌توان گزینه‌های جدیدی را به صورت برنامه‌نویسی به یک کنترل انتخاب 2 اضافه کرد:
اگر وجود ندارد ایجاد کنید
می‌توانید از .find برای انتخاب گزینه در صورت وجود آن استفاده کنید و در غیر این صورت آن را ایجاد کنید:
با استفاده از انتخابگر jQuery
از طریق انتخابگر jQuery :selected نیز می توان به موارد انتخابی دسترسی داشت:
پشتیبانی از RTL
در صورتی که ویژگی dir روی آن تنظیم شده باشد، انتخاب 2 در وب سایت های RTL کار می کند
<انتخاب> یا هر والدین آن. همچنین می توانید انتخاب 2 را با dir: "rtl".
از بین بردن کنترل انتخاب 2
روش destroy ویجت انتخاب 2 را از عنصر هدف حذف می کند. به یک کنترل استاندارد select برمی گردد:
باز کردن منوی کشویی
انتخاب 2 هنگام انجام اقدامات مختلف با استفاده از کامپوننت، چند رویداد مختلف را راه‌اندازی می‌کند و به شما امکان می‌دهد قلاب‌های سفارشی اضافه کنید و اقداماتی را انجام دهید.
باز کردن/بستن کشویی
انتخاب 2 هنگام انجام اقدامات مختلف با استفاده از کامپوننت، چند رویداد مختلف را راه‌اندازی می‌کند و به شما امکان می‌دهد قلاب‌های سفارشی اضافه کنید و اقداماتی را انجام دهید.
2 روش را انتخاب کنید
انتخاب 2 چندین روش داخلی دارد که امکان کنترل برنامه ای کامپوننت را فراهم می کند.
2 روش را انتخاب کنید
انتخاب 2 چندین روش داخلی دارد که امکان کنترل برنامه ای کامپوننت را فراهم می کند.