Multi.js: یک Select Box کاربرپسند جاوااسکریپتی

Multi.js یک اسکریپت نوشته شده در جاوااسکریپت است که به شما این امکان را می‌دهد تا باکس‌های انتخاب (Select Box) زیبا‌تر و کاربرپسندتری ساخته و تجربهٔ کاربری بهتری را برای بازدیدکنندگان‌تان رقم بزنید.

گرچه ظاهر Select Box پیش‌فرض HTML به قول معروف چنگی به دل نمی‌زند، اما کار کاربران را راه می‌اندازد (همین قضیه در مورد اِلِمان‌های Checkbox و Radio Button هم صادق است). اما برای فرانت‌اند دولوپرهایی که زیبایی از دید ایشان حرف اول و آخر را می‌زند، Multi.js یک پلاگین ارزشمند به منظور جایگزینی Select Box دیفالت HTML به شمار می‌رود.

با Multi.js، به بازدیدکنندگان لیستی از آیتم‌ها را برای انتخاب در یک فرم با ویژگی انتخاب چندتایی را می‌دهید؛ با این روش، کاربران می‌توانند روی چندین آیتم بدون تکیه بر Checkbox کلیک کنند. حتی این اسکریپت امکان جستجو هم دارد؛ بنابراین کاربران می‌توانند آیتم‌ها را جستجو کنند (مخصوصاً در لیست‌هایی که طولانی‌اند).

در این پلاگین، همه چیز بر روی Vanilla JavaScript اجرا می‌شود که از آن جمله می‌توان به ویژگی جستجو در بین آیتم‌ها اشاره کرد؛ بنابراین به هیچ گزینهٔ اضافی (وابستگی‌) دیگری نیازی ندارید (لازم به ذکر است که این پلاگین لایبرری jQuery را هم ساپورت می‌کند).

تنها چیزی که نیاز دارید یکی فایل Multi.js و دیگری استایل‌شیت این پلاگین است که پس از دانلود در اختیارتان قرار می‌گیرد (این فایل‌ها را بایستی در بخش head صفحه بارگزاری کنید). در ادامه باید یک اِلِمان <select> با فانکشن جاوااسکریپت به شکل زیر ایجاد کنید:

var select_element = document.getElementById( 'your_element_ID' );
multi( select_element );

به هر حال، عملکردهای دیفالت این پلاگین خیره‌کننده (جذاب) است و درست همان کاری را می‌کند که انتظارش را داشتید و حتی لی‌اوت‌های ریسپانسیو موبایل را هم ساپورت می‌کند. اگر علاقمند به استفاده از این پلاگین هستید، می‌توانید به ریپازیتوری Multi.js در گیت‌هاب مراجعه نمایید.